前端DOM渲染页面过程
创建DOM树
浏览器解析HTML源码,创建DOM树,在DOM树中,每一个HTML标签都有一个对应的节点(元素节点),每一个文本也都有一个对应的节点(文本节点)。
解析css
浏览器解析css代码,计算出最终的样式数据。
构建渲染树
在DOM树的基础上,通过前一步计算出的最终样式数据,忽略不需要渲染的元素(如:display: none),构建一个渲染树。渲染树中每一个节点都存储着对应的css属性。
渲染树构建完成后,浏览器就可以根据渲染树直接把页面绘制到屏幕上。