1. 程式人生 > >常用兼容代碼

常用兼容代碼

F5 span tla inner con event type lin add

兼容代碼

為任意元素綁定多個相同的事件

<script>
    function addEventListener(element,type,fn) {
        //判斷瀏覽器是否支持這個方法
        if(element.addEventListener) {
            element.addEventListener(type,fn,false);
        }else if(element.attachEvent) {
            element.attachEvent("on"+type,fn);
        }else {
            element[
"on"+type]=fn; } } </script>

為元素註冊多個事件

<script>
    function addEvent(element,type,fn) {
        //獲取該元素的事件
        var oldEvent=element["on"+type];
        //獲取該元素之前沒有註冊過的事件
        if(typeof oldEvent !="function") {
            element["on"+type]=fn;
        }else {
            
//註冊了 element["on"+type]=function() { oldEvent(); fn(); }; } } </script>

為元素解綁

<script>
    function removeEventListener(element,type,fn) {
        if(element.removeEventListener) {
            element.removeEventListener(type,fn,
false); }else if(element.detachEvent) { element.detachEvent("on"+type,fn); }else { element["on"+type]=null; } } </script>

能力檢測

<script>
    //設置
    function setInnerText(element,text) {
        if(typeof element.textContent=="undefined") {
            element.innerText=text;
        }else {
            element.textContent=text;
        }
    }
    //獲取
    function getInnerText(element) {
        if(typeof element.textContent=="undefined") {
            return element.innerText;
        }else {
            return element.textContent;
        }
    }
</script>

獲取元素

<script>
    //獲取當前元素的前一個元素
    function getPreviousElement(element) {
        if(element.previousElementSibling) {
            return element.previousElementSibling;
        }else {
            var ele=element.previousSibling;
            while(ele&&ele.nodeType!==1) {
                ele=ele.previousSibling;
            }
            return ele;
        }
    }
    //獲取當前元素的後一個元素
    function getNextElement(element) {
        if(element.nextElementSibling) {
            return element.nextElementSibling;
        }else {
            var ele=element.nextSibling;
            while(ele&&ele.nodeType!==1) {
                ele=ele.nextSibling;
            }
            return ele;
        }
    }
    //獲取父元素的第一個元素
    function getFirstElementByParent(parent) {
        if(parent.firstElementChild) {
            return parent.firstElementChild;
        }else {
            var ele=parent.firstChild;
            while(ele&&ele.nodeType!==1) {
                ele=ele.nextSibling;
            }
            return ele;
        }
    }
    //獲取父元素的最後一個元素
    function getLastElementByParent(parent) {
        if(parent.lastElementChild) {
            return parent.lastElementChild;
        }else {
            var ele=parent.lastChild;
            while(ele&&ele.nodeType!==1) {
                ele=ele.previousSibling;
            }
            return ele;
        }
    }
    //獲取兄弟元素
    function getsiblings(ele) {
        if(!ele) return;
        var element=[];
        var el=ele.previousSibling;
        while(el) {
            if(el.nodeType===1) {
                element.push(el);
            }
            el=el.previousSibling;
        }
        el=ele.nextSibling;
        while(!el) {
            if(el.nodeType===1) {
                element.push(el);
            }
            el=el.nextSibling;
        }
      return elements;
    }
</script>

常用兼容代碼