addLoadEvent函數(shù)優(yōu)勢(shì)在哪？

javascript DOM編程藝術(shù)

window.onload = function(){  
    firstFunction();  
    secondFunction();  
}

為什么說當(dāng)函數(shù)多的時(shí)候用上述匿名函數(shù)包含的方式就不妥了？

通過這種方法確實(shí)是可以解決load事件多次調(diào)用的問題，但是這種方法仍然存在一些局限。例如：如果一個(gè)頁(yè)面中存在多個(gè)javascript文件，在這多個(gè)javascript文件中可能每一個(gè)javascript文件都會(huì)用到window.load()方法，在這種情況下使用這種方法是無法解決的，同時(shí)也無法保證按照順序執(zhí)行多個(gè)注冊(cè)的函數(shù)。http://blog.csdn.net/chenssy/...

僅僅是這個(gè)原因么？

回答

編輯回答

眼雜

如果頁(yè)面一個(gè)js里面有多個(gè)window.onload=匿名方法，那么實(shí)際上只有最后一個(gè)會(huì)被執(zhí)行
如果window.onload 不是特別多，用一個(gè)匿名方法包裹需要調(diào)用的方法，這樣也是可以的，即以下形式：

window.onload = function(){  
    firstFunction();  
    secondFunction();  
}

但如果有多個(gè)js，都有 window.load，更進(jìn)一步，可以用一個(gè)專門的 addEventLoad 函數(shù)，專門來綁定 onload 事件

function addLoadEvent(func) {
    //把現(xiàn)有的 window.onload 事件處理函數(shù)的值存入變量
    var oldOnload = window.onload;
    if (typeof window.onload != "function") {
      //如果這個(gè)處理函數(shù)還沒有綁定任何函數(shù)，就像平時(shí)那樣添加新函數(shù)
      window.onload = func;
    } else {
      //如果處理函數(shù)已經(jīng)綁定了一些函數(shù)，就把新函數(shù)添加到末尾
      window.onload = function() {
        oldOnload();
        func();
      }
    }
  }

這樣，只需要確保 addLoadEvent 方法事先被聲明，之后引入的js文件里的onload方法都可以改成：
addLoadEvent(functionA)

這樣就能確保，在window.load事件觸發(fā)的時(shí)候按照js文件加載順序和同一js文件里addLoadEvent 的順序，逐一調(diào)用方法

2017年5月4日 08:04

編輯回答

吃藕丑

繼樓上所說，當(dāng)一個(gè)頁(yè)面多個(gè)window.onload時(shí)。只會(huì)執(zhí)行一個(gè)window.onload。onresize等等直接使用的，都會(huì)出現(xiàn)這種問題。所以需要通過事件監(jiān)聽的方式使每個(gè)onload都執(zhí)行：

function bind (target, type, func){
    if (target.addEventListener) {            
        target.addEventListener(type, func, false);
    }else if (target.attachEvent) {           
        target.attachEvent("on" + type, function () {
            func.call(target);
        });   
    }
};

bind(window, 'load', function () {
    alert('第一個(gè)load')
});

bind(window, 'load', function () {
    alert('第二個(gè)load')
});

2017年10月3日 05:15

編輯回答