001-DOM模型概述

DOM是文档对象模型（Document Object Model）的简称。借助DOM模型，可以将结构化文档转化成DOM树，程序可以访问、修改树里的节点，也可以新增、删除、树里的节点。程序操这棵DOM树的时候，结构化文档随之动态改变。

简单的说，DOM采取只管、一致方式对结构化文档进行模型化处理，形成一颗结构化的文档树，从而提供访问、修改该文档的简易编程接口。因此，一旦掌握了DOM编程模型，就有了使用JAVAScript脚本动态修改HTML的能力。

通过DOM技术，不仅可以操作HTML页面内容，包括新增节点、修改节点属性，删除节点等，而且还能操作HTML页面风格样式。DOM由W3C组织所倡导。因此绝大部分主流浏览器都支持这项技术。

想必大家都知道HTML文档只有一个根节点，而其他节点以根节点的子节点或者孙子节点的形式存在，最终形成一个接过话文档。DOM模型用于导航、访问结构化文档的节点，并提供新增、修改、删除结构化文档的能力。

DOM不是一种技术，他只是访问结构化文档（主要是XML文档和HTML文档）的一种思想。基于这种思想，各种语言都有自己的DOM解析器。

DOM解析器的作用就是完成结构化文档和DOM树之间的转换关系。通常来说，DOM解析器解析结构化文档，就是将磁盘上的结构化文档转换成内存中的DOM树；从而DOM树输出结构化文档，就是将内存中的DOM树转换成磁盘上的结构化文档。

对于支持DOM模型的浏览器而言，当浏览器装在一个HTML页面后，浏览器里已经得到该HTML文档对应的HTML文档对应的DOM树。在通过JavaScript脚本修改这棵DOM树时，浏览器的HTML页面会随之改变。

---

主流浏览器通过网络IO下载得到HTML文档之后，大体上会执行如下4步。

1. 解析HTML文档来构建DOM树
2. 解析外部CSS文件及<style……>元素中的样式信息，这些样式信息将会作用于HTML元素用于构建Render树
3. Render树构建好之后，接下来会执行布局过程，也就是确定每个节点在屏幕上的确切坐标。
4. 绘制render树。

---

学而时习之不亦说乎，温故而知新可以为师矣！