DOM、DOM树

DOM

JavaScript操作网页的接口，全称为“文档对象模型”(Document Object Model)。
有这几个概念：文档、元素、节点
整个文档是一个文档节点
每个标签是一个元素节点
包含在元素中的文本是文本节点
每一个属性是一个属性节点
注释属于注释节点

DOM树：

DOM树是结构
所谓层级结构是指元素和元素之间的关系
父子，兄弟
解析器输出的树是由DOM元素和属性节点组成的
当我们说树中包含DOM节点时，意思就是这个树是由实现了DOM接口的元素组成。这些实现包含了其它一些浏览器内部所需的属性。
脱离文档流后层级结构关系还是没有变的

DOM 是 Document Object Model（文档对象模型）的缩写。提供给Javascript用来动态修改文档状态…
5个常用的DOM方法：getElemenById、getElementsByTagName、getElementsByClassName、getAttribute和setAttribute

文档：DOM中的"D"

如果没有document（文档），DOM也就无从谈起。当创建了一个网页并把它加载到Web浏览器中时，DOM就在幕后悄然而生了。它把你编写的网页文档转换成为一个文档对象。

对象：DOM中的"O"

对象（object）是一种非常重要的数据类型。对象是自包含的数据集合，包含在对象里的数据可以通过两种形式访问——属性和方法。

属性是隶属于某个特定对象的变量；

方法是只有某个特定对象才能调用的函数

对象就是由一些属性和方法组合在一起而构成的一个数据实体。在javaScript中，属性(property)和方法(method)都使用“点”语法来访问：

object.propertyobject.method()

JavaScript语言里面的对象可以分为三种类型。

用户定义对象：由程序员自行创建的对象。

內建对象：內建在JavaScript语言里的对象，如Array、Math和Date等。

宿主对象：由浏览器提供的对象。

即使是在JavaScript的最初版本里，对编写脚本来说非常重要的一些宿主对象就已经可用了，他们当中最基础的对象是window（浏览器窗口）对象。

模型：DOM中的"M"

DOM中的“M”代表着“Model”（模型），它的含义是某种事物的表现形式，DOM代表着加载到浏览器窗口的当前网页。浏览器提供了网页的模型，而我们可以通过JavaScript去读取这张地图。

利用JS操作 DOM 可以让你更改网页的交互方式。所有网页的交互都依赖这种 DOM 技术。DOM 是一颗树，树枝和树叶都做了编号，通过脚本的函数去寻找哪一个枝干的哪一个叶子，对这个叶子做什么改变。例如

形如一颗倒长的树。一颗家谱树，而家谱树本身就是一种模型，其典型用法是表示表示人类家族谱系。

它很容易表明家族成员之间的关系，把复杂的关系简明地表示出来，因此这种模型非常适合表示一份html的文档：