DOMContentLoaded和load的区别

这两个事件的区别是触发时机不同,先触发DOMContentloaded,再触发load事件。jquery

dom文件加载的步骤为:dom

  • 1,解析HTML结构。
  • 2,DOM树构建完成。//DOMContentLoaded
  • 3,加载外部脚本和样式表文件。
  • 4,解析并执行脚本代码。
  • 5,加载图片等外部文件。
  • 6,页面加载完毕。//load

在第2步,会触发DOMContentLoaded事件。在第6步,触发load事件。code

// 原生js监听
document.addEventListener("DOMContentLoaded", function() {
   // ...代码...
}, false);

window.addEventListener("load", function() {
    // ...代码...
}, false);
// jquery监听

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

//load
$(document).load(function() {
    // ...代码...
});
相关文章
相关标签/搜索