DOMContentLoaded、ready、load事件的区别

 

DOM文档加载的顺序

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

ready

当 DOM(文档对象模型) 已经加载,并且页面(包括图像)已经完全呈现时,会发生 ready 事件。

由于该事件在文档就绪后发生,因此把所有其他的 jQuery 事件和函数置于该事件中是非常好的做法。

DOMContentLoaded 

当初始的 HTML 文档被完全加载和解析完成之后,DOMContentLoaded 事件被触发,而无需等待样式表、图像、脚本、子框架的完全加载。

注意:DOMContentLoaded 事件必须等待其所属script之前的样式表加载解析完成才会触发。 

load

当整个页面及所有依赖资源如样式表、图片、脚本都已完成加载时,将触发load事件。

posted @ 2020-06-02 15:15  白树  阅读(198)  评论(0编辑  收藏