我是靠谱客的博主 可靠板凳,最近开发中收集的这篇文章主要介绍浏览器是如何渲染页面的,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

cssom(css object model):数据传输和浏览器渲染管道之间相互交互的时候采用的一种技术

将css选择器构造成树形结构,css样式对象化

cssom包含两个部分:model和view

model 描述样式标准和规则的 link ref=stylesheet

view 和元素相关的api部分 link href="style.css"

DOM树的构建过程

通过网络获取字节流和字符

分词,获取语法数列

得到一个一个的节点

根据节点序列,构建DOM树

css样式的cssom依赖于DOM

递归为每一个DOM节点,向下添加样式 --> 向下级联

浏览器如何渲染页面的:

1. 根据html文件构建DOM和cssom树,如果遇到js会阻塞DOM和cssom,会优先加载js,加载完js再去构建DOM和cssom

2. 构建渲染树,渲染树是DOM和cssom合并而成的,计算每个页面元素,最终渲染到页面

3. 页面重绘和重排,页面渲染完毕后,浏览器会根据js操作DOM元素,对页面进行重绘和重排

补充:在渲染过程中,如果遇到js将会优先执行js

最后

以上就是可靠板凳为你收集整理的浏览器是如何渲染页面的的全部内容,希望文章能够帮你解决浏览器是如何渲染页面的所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(81)

评论列表共有 0 条评论

立即
投稿
返回
顶部