什么是网页
首先,我们知道网页是由html+css+javascript三大部分组成的,我们可以形象的把网页比喻成一个人,html就是他的样子,根据内容来形容他的高矮胖瘦,css就是他的外表,他的着装是否华丽,五官是否精美,那么JavaScript的就相当于人的行为与动作.所以通过html、css、javascript可以组成一个完整的网页。
那浏览器流程是怎样的呢?
我们先来看看下面这幅图
从上面的图可以看出,浏览器会解析三个东西
一个是HTML,解析它时会产生一个DOM Tree。
CSS,解析CSS, 构建 CSSOM Tree。
Javascript,脚本,主要是通过DOM API和CSSOM API来操作DOM Tree和CSS Rule Tree.
解析完成后,浏览器引擎会通过DOM Tree 和 CSS Rule Tree 来构造 Rendering Tree。注意:
Rendering Tree 渲染树并不等同于DOM树,因为一些像Header或display:none的东西就没必要放在渲染树中了。
CSS 的 Rule Tree主要是为了完成匹配并把CSS Rule附加上Rendering Tree上的每个Element。也就是DOM结点。也就是所谓的Frame。
然后,计算每个Frame(也就是每个Element)的位置,这又叫layout和reflow过程。
3)最后通过调用操作系统Native GUI的API绘制。