事件DOMContentLoaded和load的區別

1.當 onload 事件觸發時，頁面上所有的DOM，樣式表，腳本，圖片，flash都已經加載完成了。

2.當 DOMContentLoaded 事件觸發時，僅當DOM加載完成，不包括樣式表，圖片，flash。

我們需要給一些元素的事件綁定處理函數。但問題是，如果那個元素還沒有加載到頁面上，但是綁定事件已經執行完了，是沒有效果的。

這兩個事件大致就是用來避免這樣一種情況，將綁定的函數放在這兩個事件的回調中，保證能在頁面的某些元素加載完畢之后再綁定事件的函數。

DOM文檔加載的步驟為

1. 解析HTML結構。
2. 加載外部腳本和樣式表文件。
3. 解析並執行腳本代碼。
4. DOM樹構建完成。//DOMContentLoaded
5. 加載圖片等外部文件。
6. 頁面加載完畢。//load

在第4步，會觸發DOMContentLoaded事件。在第6步，觸發load事件。
在沒有出現DOMContentLoaded事件出現以前，許多類庫中都有模擬這個事件的方法，比如jQuery中著名的 $(document).ready(function(){}); 。

// 不兼容老的瀏覽器
document.addEventListener("DOMContentLoaded", function() {
   // ...代碼...
}, false);

window.addEventListener("load", function() {
    // ...代碼...
}, false);