浏览器与页面渲染

128 阅读1分钟

浏览器组成部分

  1. 用户界面:用户看到的浏览器样子

  2. 浏览器引擎:让浏览器运行的程序接口集合,主要是查询和操作渲染引擎

  3. 渲染引擎:解析 HTML/CSS ,将解析的结果渲染到页面的程序

  4. 网络:进行网络请求的程序

  5. UI后端:绘制组合选择框及对话框等基本组件的程序

  6. JS解释器:解释执行Js代码的程序

  7. 数据存储:浏览器存储相关的程序 cookie/stronge

渲染

定义

渲染:用一个特定的软件将 模型(一个程序)转化为用户能看到的图像的过程

渲染引擎:内部具备一套绘制图像方法集合,渲染引擎可以让特定的方法执行把 HTML/CSS 代码解析成图像显示在浏览器窗口中。

渲染过程

标准模式声明

从 IE6 开始,W3C标准解析渲染,之前各自浏览器厂商都有自己的渲染标准

<!DOCTYPE html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

DTD: 文档类型定义

种类:严格版本(Strict)、过渡版本(Transitional)、框架版本(Frameset)

/** 
 * JS 查询当前模式
 * BackCompat 怪异模式
 * CSS1Compat 标准模式
 */
document.compatMode