对 DOMContentLoaded 事件的误解

Question

从MDN那里，我知道DOMContentLoaded不会等待样式表。

当初始 HTML 文档完全加载和分析时，将触发 DOMContentLoaded 事件，而无需等待样式表、图像和子帧完成加载。

但来自 varvy.com 和谷歌

一个常见的误解是样式与domContentLoaded无关，但根据W3 HTML5规范，这是不正确的

。domContentLoaded：标记了 DOM 都准备好并且没有阻止 JavaScript 执行的样式表的点 - 这意味着我们现在可以(可能)构造渲染树。

domContentLoaded通常会标记DOM和CSSOM都准备好的时间。

那么，哪一个是对的呢？ 阻止脚本的样式表是什么？

Answer 1

所有内联Javascripts都必须执行，因为它们会影响dom。document.write例如。如果JS访问一些尚未加载的CSS。另一种说法是"CSS正在阻止JS"。所以。。DOM 等待等待 CSS 加载的 JS。

DOM ----(wait for)--->

JS ----(wait for)---> CSS

另一种说法是：

DOM <---(blocking)--- JS <---(blocking)---- CSS

因此，阻塞 CSS 必须在 domContentLoaded 之前加载！在那之后，没有样式表阻止JavaScript执行！现在粗体有意义吗？

CSSOM 已准备就绪意味着它已准备好供 DOM 使用，因此未被 DOM 使用的 CSS 可以继续加载。

现在错念消失了吗？