1、onload 事件
定義與語法
onload事件會在頁面或者圖像加載完成后立即發生。
法:onload="SomeJavaScriptCode“;
參數:SomeJavaScriptCode 描述:必需。規定該事件發生時執行的 JavaScript。
支持該事件的 HTML 標簽:<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>
支持該事件的 JavaScript 對象:image, layer, window
實例
在本例中,文本 "Page is loaded" 會被顯示在狀態欄中:
<html> <head> <script type="text/javascript"> function load() { window.status="Page is loaded" } </script> </head> <body onload="load()"> </body> </html>
2、DOMContentLoaded事件
這個事件是從HTML中的onLoad的延伸而來的,當一個頁面完成加載時,初始化腳本的方法是使用load事件,但這個類函數的缺點是僅在所有資源都完全加載后才被觸發,這有時會導致比較嚴重的延遲,開發人員隨后創建了一種自定義事件,domready,它在DOM加載之后及資源加載之前被觸發。
domready事件迅速被眾多JavaScript庫所采用,它開始在本地瀏覽器中以DOMContentLoaded的形式被使用;此外,它目前已在HTML5中被標准化,下面的代碼顯示了DOMContentLoaded是如何在document對象中被觸發的;
document.addeventListener('DOMContentLoaded',function(){...},false);
3、DOM加載順序
1、解析HTML結構。
2、加載外部腳本和樣式表文件。
3、解析並執行腳本代碼。
4、構造HTML DOM模型。
5、加載圖片等外部文件。
6、頁面加載完畢。
