JavaScript在DOM树构建中扮演着怎样的关键角色？

本文共计3423个文字，预计阅读时间需要14分钟。

目录 + 文档对象模型（DOM） + DOM 和 JavaScript + DOM 树如何生成 + 解析 HTML 的三个阶段 + HTML 解析流程详解 + JavaScript 如何影响 DOM + 生成解析过程中的优化 + 总结 + 文档对象模型（DOM）

目录

• 文档对象模型 (DOM)
• DOM 和 JavaScript
• DOM 树如何生成
• 解析 HTML 的三个阶段
  
• 详解 HTML 解析流程
  
• JavaScript 是如何影响 DOM 生成的
• 解析过程中的优化
  
• 总结

文档对象模型 (DOM)

文档对象模型 (DOM)会将 web 页面与到脚本或编程语言连接起来。DOM模型表示具有逻辑树的文档。树的每个分支的终点都是一个节点(node)，每个节点都包含着对象(objects)。DOM的方法(methods)允许以编程方式进行访问树，从而改变文档的结构，样式和内容。节点可以关联上事件处理器，一旦某一事件被触发了，那些事件处理器就会被执行。
从网络传给渲染引擎的 HTML 文件字节流是无法直接被渲染引擎理解的，所以要将其转化为渲染引擎能够理解的内部结构，这个结构就是 DOM。DOM 提供了对 HTML 文档结构化的表述。