文章来源于网络收集而来，版权归原创者所有，如有侵权请及时联系！
浏览器渲染
浏览器显示页面的原理
- 获取 HTML 文档及样式表文件
- 解析成对应的树形数据结构
- DOM tree
- CSSOM tree
- 计算可见节点形成 render tree
- 计算 DOM 的形状及位置进行布局
- 将每个节点转化为实际像素绘制到视口上（栅格化）
render tree（页面上所显示的最终结果）是由 DOM tree（开发工具中所显示的 HTML 所定义的内容结构）与 CSSOM tree（样式表所定义的规则结构）合并并剔除不可见的节点所形成的，其中不包含如下节点:
- 本身不可见的
<html><head><meta><link><style><script>
- 设置了 display: none; 样式的
参考资料
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论