什么是 DOM
文档对象模型(Document Object Model)。它提供了对文档结构化的描述,并将HTML页面与脚本、程序语言联系起来。
在渲染引擎中，DOM有以下几个层面的作用：
- 从页面来看，DOM就是生成页面的基本数据结构
- 从JS脚本来看，DOM提供给JS脚本操作的接口，利用该接口，JS就能对DOM结构进行访问，以此来改变文档的结构、样式以及内容。
- 有时，DOM就像一个安全防护栏，某些不安全的内容在DOM的解析阶段就会拦截。
DOM树如何生成
HTML 解析器（HTMLParser）： 负责将 HTML 字节流转换为 DOM 结构。
关于HTML解析器是如何拿到网络进程的数据的呢？
由此可见，网络进程和渲染进程之间是有一个共享的数据通道，网络进程加载了多少数据，就会将数据传给HTML解析器进程解析，HTML解析器接收到数据之后，这些数据(字节流)将转化成DOM，相关过程如下：
有以下三个阶段：
- 通过分词器将字节流转化为Token(也就是一个片段)，分为Tag Token和文本Token
- Token解析成DOM节点
- 再将DOM节点添加到DOM树中。
有三个阶段：
1、通过分词器将字节流转化为Token。 分词器先将字节流转换为一个个 Token，分为 Tag Token 和文本 Token。
注意，这里的Token并不是我们之前理解的Token，这里就是一个片段。
2、Token解析为DOM节点。
3、将 DOM节点添加到DOM树中。
JavaScript影响DOM的生成
- 内嵌的JS脚本(嵌入一段
script标签的代码)，前面的解析过程都是一样的，但解析到script标签时，渲染引擎会判断这是一段脚本，此时HTML解析器就会暂停对DOM的解析，因为JS可能要修改当前已生成的DOM结构，暂停解析后，JS引擎介入并执行script标签中的这段脚本，脚本执行完成之后又，HTML解析器恢复解析过程，将会继续解析后续的内容，直到生成最终的DOM。 - 引入JS文件和之前大体一致，区别在于暂停解析之后执行JS代码，会先下载这段js代码。
