Render Tree和CSSOM Tree的区别？

轩辕小不懂发布于 2021-12-06 16:20

阅读 490

答案 1

分类：WEB前端开发

Nen 2021-12-06 16:37

- 程序员

DOM树

① 浏览器把获取到的html代码解析成一个DOM树，html中的每个标签都是DOM树中的一个节点，根节点就是我们常用的document对象。

② DOM树里面包含了所有的html标签，包括display:none;隐藏，还有用JS动态添加的元素等。

CSSOM树

CSS下载完之后对CSS进行解析，解析成CSS对象，然后把CSS对象组装起来，构建CSSOM树

Render Tree

① CSSOM树和DOM树连接在一起(一一对应)形成一个Render Tree，渲染树用来计算可见元素的布局并且作

为将像素渲染到屏幕上的过程的输入。

② 渲染树会忽略display: none;的元素