hxq的库

在页面中使用

可以调取html模板

 

 

/**
 * Created by DY040 on 2017/10/31.
 */




var hxq = {
    init: function () {
        var self = this;
        // self.router.init();
        // self.rem(); rem适配


    },
    router: {
        init: function () {
            var self = this;
            self.getNode();
            // console.log(self.getNode)

        },
        getTemplate: function (url, node) {
            console.log(url)
            var xhr;
            if (window.XMLHttpRequest) {
                // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
                xhr = new XMLHttpRequest();
            }
            else {
                // IE6, IE5 浏览器执行代码
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    node.outerHTML = xhr.responseText
                }
            }
            xhr.open("POST", url, false);
            xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xhr.send();


        },
        getNode: function () {

            var nodes = document.querySelectorAll('[h-src]');
            console.log(nodes)
            nodes.forEach(function (v, k, ele) {
                var url = v.getAttribute('h-src')


                this.getTemplate(url, v)
            }.bind(this))
        }
    },
    rem: function () {
        document.head.innerHTML = '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1">' + document.head.innerHTML

            var width = document.documentElement.clientWidth / 10;
            document.documentElement.style.fontSize = width + 'px';
    },
    EventUtil: {
        /*
         * EventUtil.addHandler(document.querySelector('button'),'click',fn)
         * */
        /*添加事件*/
        addHandler: function (ele, type, handler) {
            if (ele.addEventListener) {
                ele.addEventListener(type, handler, false);
            } else if (ele.attachEvent) {
                ele.attachEvent('on' + type, handler);
            } else {
                ele['on' + type] = handler;
            }
        },
        /*移除事件*/
        removeHandler: function (ele, type, handler = false) {
            if (ele.removeEventListener) {
                ele.removeEventListener(type, handler, false);
            } else if (ele.detachEvent) {
                ele.detachEvent('on' + type, handler);
            } else {
                ele['on' + type] = null;
            }
        },
        getEvent: function () {
            /*获取事件对象*/
            return event ? event : window.event;
        },
        getTarget: function (event) {
            /*获取事件触发者*/
            return event.target || event.srcElement;
        },
        /*取消默认行为*/
        preventDefault: function (event) {
            if (event.preventDefault) {
                event.preventDefault()
            } else {
                event.returnValue = false;
            }
        },
        /*阻止冒泡*/
        stopPropagation: function (event) {
            /*阻止默认行为*/
            if (event.stopPropagation) {
                event.stopPropagation()
            } else {
                event.cancelBubble();
            }
        },
        /*获取页面距离左上距离*/
        getPageX: function (event) {
            if (event.pageX) {
                return event.pageX;
            } else {
                return event.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft);
            }
        },
        getPageY: function (event) {
            if (event.pageY) {
                return event.pageY;
            } else {
                return event.clientY + (document.body.scrollTop || document.documentElement.scrollTop);
            }
        }
    },

    DOM: {
        //获取视口高度
        clientHeight: function () {
            if (typeof window.innerHeight !== 'undefined') {
                return window.innerHeight;
            } else if (document.documentElement) {
                return document.documentElement.clientHeight;
            } else {
                return document.body.clientHeight;
            }
        },
        /*获取视口宽度*/
        clientWidth: function () {
            if (typeof window.innerWidth !== 'undefined') {
                return window.innerWidth;
            } else if (document.documentElement) {
                return document.documentElement.clientWidth;
            } else {
                return document.body.clientWidth;
            }

        }
    }


};

hxq.init();