以前对 html 有过简单的了解, 由于之后可能会对前端有进一步的使用, 所以抽空把前端基础知识再温故一下.
在学习 HTML+CSS+JS 之前, 有一点小疑惑, 为什么我写了一个. HTML 文件, 就能被浏览器转换成界面呢?
这就全靠于浏览器内核啦~
浏览器内核又可以分成两部分: 渲染引擎 (layout engineer 或者 RenderingEngine) 和 JS 引擎.
浏览器内核负责对网页语法的解释 (如 HTML,JavaScript) 并渲染 (显示) 网页. 所以, 通常所谓的浏览器内核也就是浏览器所采用的渲染引擎, 渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息. 不同的浏览器内核对网页编写语法的解释也有不同, 因此同一网页在不同的内核的浏览器里的渲染 (显示) 效果也可能不同, 这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因.
主流浏览器内核:
浏览器内核包括渲染引擎和 JS 引擎, 由于 JS 引擎越来越独立, 内核就倾向于只指渲染引擎.
渲染引擎
一种对 HTML 文档进行解析并将其显示在页面上的工具. 它负责取得网页的内容(HTML,xml, 图象等等), 整理信息(例如加入 CSS 等), 以及计算网页的显示方式然后会输出至显示器或打印机
JS 引擎
JavaScript 引擎是一个专门处理 JavaScript 脚本的虚拟机, 一般会附带在网页浏览器之中.
渲染引擎工作流程
HTML 解析器解析 DOMM 树(解析为 DOM 树上个节点, 同时解析 CSS 样式)
渲染树结构(具有一定的视觉效果, 并按照一定顺序排列在屏幕上)
布局渲染树(为每个节点分配固定坐标)
绘制 DOM 树(渲染引擎会遍历所有的节点, 由 UI 后端绘制)
图片来自: https://www.cnblogs.com/microcosm/p/6815902.html
来源: http://www.jianshu.com/p/07457910bd9a