执行多个onload被覆盖问题

一个页面执行多个window.onload，会被最后一个覆盖，前面n个的内容得不到执行，如

 

window.onload = function(){  
    var para =document.createElement("p");  
    var info = "NodeName:";  
    info += para.nodeName;  
    info += "     NodeType:";  
    info += para.nodeType;  
    alert(info);  
}  
  
  
window.onload = function(){  
    var para = document.getElementById("testid");  
    var e = document.createElement("p");  
    var txt = document.createTextNode("hello zmz");  
    para.appendChild(e);  
    e.appendChild(txt);  
  
  
}  

 

只执行了第二个window.onload，但我们肯定要让两个window.onload都执行。

 

 

方法一：

 

window.onload = function(){
num1();
num2();
}

function num1(){
console.log(第一个函数要执行的语句);
}

function num1(){
console.log(第一个函数要执行的语句);
}

 

方法二：

 

 

function addLoadEvent(func){  
    var oldonload = window.onload; //把现在有window.onload事件处理函数的值存入变量oldonload。  
    if(typeof window.onload != 'function'){ //如果这个处理函数还没有绑定任何函数，就像平时那样把新函数添加给它  
        window.onload = func;  
    }else{ //如果在这个处理函数上已经绑定了一些函数。就把新函数追加到现有指令的末尾  
        window.onload = function(){  
            oldonload();  
            func();  
        }  
    }  
  
}  
调用：
addLoadEvent(num1);
addLoadEvent(num2);

 

不完美：我看很多博客都是推荐用方法二，但是如果是这种情况，还是只会执行最后一个window.onload：

 

function addLoadEvent(func){  
    var oldonload = window.onload; //把现在有window.onload事件处理函数的值存入变量oldonload。  
    if(typeof window.onload != 'function'){ //如果这个处理函数还没有绑定任何函数，就像平时那样把新函数添加给它  
        window.onload = func;  
    }else{ //如果在这个处理函数上已经绑定了一些函数。就把新函数追加到现有指令的末尾  
        window.onload = function(){  
            oldonload();  
            func();  
        }  
    }  
  
}  
调用：
addLoadEvent(num1);
addLoadEvent(num2);

你自己的是调用完了，然后你的同事再接下来的js写了一个加载事件：
window.onload = function(){              
    console.log('最后再来个页面加载函数')
}  

结果妥妥的被覆盖了，只会执行最后一个window.load的内容

方法三：尝试的第三种方法可以解决上面的问题

 

/**
     * window.onload加载多个函数
     * */
    function addLoadEvent(func) {

        if (document.all){
            window.attachEvent("onload",func)//对于IE
        }
        else{
            window.addEventListener("load",func,false);//对于FireFox
        }
    }   

 

 

参考文献：

 

https://www.cnblogs.com/liwenjuan/p/3454435.html

 

https://segmentfault.com/q/1010000009857374