【LSP】Dom树 CSS树 render树规则原理

无名 · 发表于 2022-5-8 16:56:43

? 前端不可不学的浏览器渲染机制，阿里年年问，去一个栽一个。听说百度也在考这个，你还不准备学吗？

首先你要了解浏览器渲染的顺序：
? 1.构建dom 树
? 2.构建css 树
? 3.构建渲染树
? 4.节点布局
? 5.页面渲染

什么是dom 树？

? 浏览器将HTML解析成树形的数据结构，简称DOM。
? DOM 是文档对象模型 (Document Object Model) 的缩写。它是 HTML 文档的对象表示，同时也是外部内容（例如 JavaScript）与 HTML 元素之间的接口。解析树的根节点是Document对象。

那我们就可以这样操作 dom 树：

<html>
<head>
<title>never-online'swebsite</title>

</head>
<body>
<div>tutorialofDHTMLandjavascriptprogramming</div>
<input onclick="changedivText('change?')" type="button" value="change"/>
</body>
</html>

不缩了楼层开始更新[狂笑]
Dom树节点解析以及知识点梳理---32楼以下

[其他技术] 【LSP】Dom树 CSS树 render树规则原理

相关帖子