通过渲染
* 浏览器的工作原理:
服务器会启动serversocket类对象,对一个端口进行监听(8080),浏览器通过域名访问请求,DNS域名解析器根据域名查到对应的IP,向该IP发起请求,为get请求,请求html字段,服务器查找html资源,找不到则返回404,找到则返回给浏览器,浏览器通过渲染解析显示
*浏览器的组成部件:用户界面(刷新等按钮)、浏览器引擎(发送用户浏览器的请求到呈现引擎)、呈现引擎(关键引擎,解析html转化为DOM树)、网络层、UI后端(绘制窗口)、JS解析器、Data存储(持久存储,存到磁盘cookie)
*渲染的流程:
- 服务器返回html资源给浏览器
- 浏览器的呈现引擎解析html文件生成DOM节点树,同时加载css样式生成CSSDOM树、执行JS文件
- 整合DOM节点树+CSS样式树,生成渲染树
- 进入布局阶段,为每一个DOM节点数资源分配位置
- 遍历资源数由UI后端绘制出来页面
* 不同浏览器区别在于内核不同,不同的内核解析html文件的方式流程不一样,解析css样式也会有所不同,所以会有不同的兼容性问题
Trident内核: IE
Webkit内核:Chrome,Safari
Gecko内核:FireFox