本文详细解析了DOMContentLoaded事件的触发机制，包括其在不同元素（如js、css、img）存在情况下的行为特点，重点阐述了js、css、img元素之间的依赖关系，以及如何正确理解并应用这一事件来优化网页加载体验。
0.加载完页面，解析完所有标签（不包括执行CSS和JS），并如规范中所说的设置 interactive 和执行每个静态的script标签中的JS，然后触发。
1.没有js，有css，有img，DOMContentLoaded事件不直接等待CSS文件、图片的加载完成
2.有js，没有css，有img，DOMContentLoaded事件需要等待JS执行完才触发
3.有js，而且js前面有css，没有img，DOMContentLoaded事件需要等待css加载完，JS执行完才触发
总结：DOMContentLoaded依赖js执行完，js执行依赖css加载完。
tips：img展现，依赖css加载完，不依赖js执行完。
参考：http://www.alloyteam.com/2014/03/effect-js-css-and-img-event-of-domcontentloaded/
扫一扫
1768
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
