事件DOMContentLoaded和load的區別

Noodles 發布于2019-08-20 15:31 / 1567人閱讀

摘要：區別是觸發的時機不一樣，先觸發事件，后觸發事件。文檔加載的步驟為解析結構。加載外部腳本和樣式表文件。解析并執行腳本代碼。在第步，觸發事件。可參考用原生可以這么寫不兼容老的瀏覽器，兼容寫法見中與事件，或用代碼代碼用這么寫代碼代碼

區別是:觸發的時機不一樣，先觸發DOMContentLoaded事件，后觸發load事件。

DOM文檔加載的步驟為

1,解析HTML結構。
2,DOM樹構建完成。//DOMContentLoaded
3,加載外部腳本和樣式表文件。
4,解析并執行腳本代碼。
5,加載圖片等外部文件。
6,頁面加載完畢。//load
在第2步，會觸發DOMContentLoaded事件。在第6步，觸發load事件。

可參考
https://developer.mozilla.org...

用原生js可以這么寫

// 不兼容老的瀏覽器，兼容寫法見[jQuery中ready與load事件](http://www.imooc.com/code/3253)，或用jQuery
document.addEventListener("DOMContentLoaded", function() {
   // ...代碼...
}, false);

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

用jQuery這么寫

// DOMContentLoaded
$(document).ready(function() {
    // ...代碼...
});

//load
$(document).load(function() {
    // ...代碼...
});

云服務器 GPU云服務器 load事件寬帶和專線的區別專線和寬帶的區別空間和域名的區別

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/82305.html

DOMContentLoaded與load的區別

摘要：所以所需要的時間必然大于等于所需要的時間。頁面的生命周期主要有三個重要的事件，已經構建好，可以對節點進行操作，所有資源加載完畢，可以對資源進行一系列操作，比如獲取圖片寬高等基本不會用到，當瀏覽器窗口關閉或者刷新時，會觸發事件。 DOMContentLoaded與load的區別 showImg(https://segmentfault.com/img/remote/14600000192...

niuxiaowei111 2019-08-26 13:52 評論0 收藏0
頁面生命周期：DOMContentLoaded, load, beforeunload, unloa

摘要：所以有可能在所有腳本執行完畢后觸發。如果用戶即將離開頁面或者關閉窗口時，事件將會被觸發以進行額外的確認。狀態表示事件即將被觸發。總結頁面事件的生命周期事件在樹構建完畢后被觸發，我們可以在這個階段使用去訪問元素。頁面生命周期：DOMContentLoaded, load, beforeunload, unload 原文地址：http://javascript.info/onload.....

lx1036 2019-08-01 17:44 評論0 收藏0
頁面生命周期：DOMContentLoaded, load, beforeunload, unloa

摘要：所以有可能在所有腳本執行完畢后觸發。如果用戶即將離開頁面或者關閉窗口時，事件將會被觸發以進行額外的確認。狀態表示事件即將被觸發。總結頁面事件的生命周期事件在樹構建完畢后被觸發，我們可以在這個階段使用去訪問元素。頁面生命周期：DOMContentLoaded, load, beforeunload, unload 原文地址：http://javascript.info/onload.....

luckyyulin 2019-08-21 16:55 評論0 收藏0