onload事件是HTML DOM Event 對象的一個屬性,又叫事件句柄(Event Handlers),它會在頁面或圖像加載完成后(注意是加載完成后)立即發生。

window.onload = func的作用就是在頁面加載完成后將func函數綁定到onload事件上并執行。如果頁面加載完成之后,只需要執行一個函數func,那么只用window.onload = func也就可以了,但是如果需要執行兩個甚至多個函數呢?

javascript中的addLoadEvent函數解析

直接調用兩次onload不就行了:

window.onload=firstfunction;
window.onload=secondfunction;

国产视频app這么做的話,只有secondfunction會被綁定,因為前面的值被后面的值覆蓋了。那么該怎么辦?

將兩個函數合并到一個函數當中不就行了,匿名函數發揮作用的時候到了:

window.onload = function() {
    fristfunction;
    secondfunction;
}

不過,它也只能綁定兩個函數。還好,大神們早已解決了這個問題。西蒙·威利森 (Simon Willison)——jQuery框架的開發者之一編寫了下面的addLoadEvent函數:

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);
addLoadEvent(thirdfunction);
...

附:相關概念

国产视频app1  支持onload事件的 HTML 標簽有<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>

国产视频app    支持該事件的 JavaScript 對象有image(圖像), layer, window(整個頁面)

国产视频app2  事件句柄(Event Handlers),可以在某個事件發生時通過一個事件句柄對某個元素進行操作。

    事件是可以被控件識別的操作,如按下確定按鈕,選擇某個單選按鈕或者復選框。每一種控件有自己可以識別的事件,如窗體的加載、單擊、雙擊等事件,編輯框(文本框)的文本改變事件,等等。

国产视频app3  HTML DOM Event 對象代表事件的狀態,比如事件在其中發生的元素、鍵盤按鍵的狀態、鼠標的位置、鼠標按鈕的狀態等。事件通常與函數結合使用,函數不會在事件發生前被執行(這句很重要)。