在工作時，我們給一個元素綁定了事件，如果dom還沒載入完成，就執行了js程式碼，就不會繫結成功。常規解決方案就是用：

window.onload = EventFunction;

可是如果有兩個 事件，

• window.onload = EventFunction1;
• window.onload = EventFunction2;

那2就會將1取代，這時你可能會想：每個事件處理板書只能繫結一條指令。有一種辦法可以讓我們避開這一難題：可以先建立一個匿名函式來容納這兩個函式，然後把那個匿名函式繫結到onload事件上，如下所示：

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

它確實能很好地工作————在需要繫結的函式不是很多的場合，這應該是最簡單的解決方案了。

這裡還有一個彈性最佳的解決方案——不管你打算頁面載入完畢時執行多少個函式，它都可以應付自如。這個方案需要額外編寫一些程式碼，把函式繫結到window.onload事件就非常易行了。

這個函式的名字是addLoadEvent，它是由Simon Willison寫的。它只有一個引數：打算在頁面載入完畢時執行的函式的名字。

下面是此函式要完成的操作：

1.把現有的 window.onload 事件處理函式的值存入變數 oldonload;

2.如果在這個處理函式上還沒有繫結任何函式，就像平時那樣把新函式新增給它；

3.如果在這個處理函式上已經綁定了一些函式，就把新函式追加到現有指令的末尾。

function addLoadEvent(func) {
    var oldonload = window.onload;
    if(typeof window.onload != 'function'){
      window.onload = func;
    }else{
      window.onload = function(){
        oldonload();
        func();
      }
    }
  }

這將把那些在頁面載入完畢時執行的函式建立為一個佇列。如果想把剛才那兩個函式新增到佇列裡去，只需要寫出以下程式碼就行了：

addLoadEvent(firstFunction);
addLoadEvent(secondFunction);

我發現這個函式非常實用，尤其是在程式碼變得越來越複雜的時候。無論打算在頁面載入完畢時執行多少個函式，只要定一條語句就可以安排好一切。

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。