Javascript基础——DOM

DOM学习要点

DOM（ Document Object Model）即文档对象模型， 针对 HTML和 XML文档的 API（ 应用程序接口）。 DOM描绘了一个层次化的节点树，运行开发人员添加、移除和修改页面的某一部分。 DOM脱胎于 Netscape及微软公司创始的 DHTML（动态 HTML），但现在它已经成为表现和操作页面标记的真正跨平台、语言中立的方式。

DOM介绍

DOM中的三个字母， D（文档）可以理解为整个 Web加载的网页文档； O（对象）可以理解为类似 window对象之类的东西，可以调用属性和方法，这里我们说的是 document对象； M（模型）可以理解为网页文档的树型结构。
DOM有三个等级， 分别是 DOM1、 DOM2、 DOM3， 并且 DOM1在 1998年 10月成为W3C标准。 DOM1所支持的浏览器包括 IE6+、 Firefox、 Safari、 Chrome和 Opera1.7+。

PS： IE中的所有 DOM对象都是以 COM对象的形式实现的，这意味着 IE中的 DOM可能会和其他浏览器有一定的差异。

1、节点

加载HTML页面的时候，Web浏览器会生成一个节点树，表示页面内部结构，DOM将这种树形结构理解为由节点组成。

从上面的树形结构，我们理解几个感念，html没有父辈、没有兄弟。所以html就是根元素。 head标签是 html子标签， meta和 title标签之间是兄弟关系。 如果把每个标签当作一个节点的话，那么这些节点组合成了一棵节点树。
PS：后面我们经常把标签称作为元素，是一个意思。

2、节点种类

节点种类有：元素节点、文本节点、属性节点

查找元素

PS：属性既可以用来获取属性值，也可以用来设置属性值。

DOM节点

1、node节点属性

节点可以分为元素节点、属性节点和文本节点，而这些节点又有三个非常有用的属性，分别为： nodeName、 nodeType和 nodeValue。

2、层次节点的属性

节点的层次结构可以划分为： 父节点与子节点、 兄弟节点这两种。 当我们获取其中一个元素节点的时候，就可以使用层次节点属性来获取它相关层次的节点。