javascript - 浏览器如何根据CSS样式生成CSSOM的详细信息?-LMLPHP

a stackoverflow question中,cssom和dom是同步生成的,如果cssom是首先生成的,它如何知道dom的外观并生成cssom树,就像上面的图片一样,它看起来像dom树加上css属性。到CSS。

javascript - 浏览器如何根据CSS样式生成CSSOM的详细信息?-LMLPHP

当我的html如下所示时,我也可以使用上面的样式;
javascript - 浏览器如何根据CSS样式生成CSSOM的详细信息?-LMLPHP

即使我的html看起来像这样。

javascript - 浏览器如何根据CSS样式生成CSSOM的详细信息?-LMLPHP

最佳答案

CSSOM不需要了解任何有关dom的信息,因为CSSOM仅是样式规则树。

您指的是“渲染树”,它是在DOM和CSSOM准备就绪后创建的。

为了更清楚一点:


HTML开始被解析
出现样式标签
解析器不会暂停DOM树构建并开始构建CSSOM的过程
构建DOM树+构建CSSOM =浏览器开始构建渲染树
基于渲染树的浏览器开始计算布局。
之后,绘画开始。

关于javascript - 浏览器如何根据CSS样式生成CSSOM的详细信息?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58011631/

10-12 06:41