DOM 总结（一）

 DOM 总结（一）

 

 

 一，概念：

     DOM 全称：Document Object Modle （文档目标模板），DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。 换句话说，这是表示和处理一个HTML或XML文档的常用方法。有一点很重要，DOM的设计是以对象管理组织（OMG）的规约为基础的，因此可以用于任何编程语言.

 二，含义：

 

    D：文档 – html 文档 或 xml 文档

    O：对象 – document 对象的属性和方法

    M：模型

    DOM 是针对xml(html)的基于树的API。 

    DOM树:节点（node）的层次。

    DOM 把一个文档表示为一棵家谱树（父，子，兄弟）

DOM定义了Node的接口以及许多种节点类型来表示XML节点的多个方面

 三，DOM结构：

 DOM结构就类似与家谱结构图 ：

    

  DOM真正的结构图

    

     所以DOM中是这样规定的：

     1.整个文档是一个文档节点 

     2.每个 HTML 标签是一个元素节点 

     3.包含在 HTML 元素中的文本是文本节点 

     4.每一个 HTML 属性是一个属性节点 

     5.注释属于注释节点 

     因此DOM，HTML 文档中的每个成分都是一个节点

  

 四：Node层

    节点彼此都有等级关系：

    HTML 文档中的所有节点组成了一个文档树（或节点树）。HTML 文档中的每个元素、   属性、文本等都代表着树中的一个节点。树起始于文档节点，并由此继续伸出枝条，直到处于这棵树最低级别的所有文本节点为止。

     

   节点：

   由结构图中我们可以看到，整个文档就是一个文档节点。 

   而每一个HMTL标签都是一个元素节点。 

   标签中的文字则是文本节点。 

   标签的属性是属性节点。 

   一切都是节点……

    节点树：

节点树的概念从图中一目了然，最上面的就是“树根”了。节点之间有父子关系，祖先与子孙关系，兄妹关系。这些关系从图中也很好看出来，直接连线的就是父子关系了。而有一个父亲的就是兄妹关系……

 

最常用Node的接口和特性：

 

特性/方法	类型/返回类型	说明
nodeName	String	根据节点的类型而定义名字
nodeValue	String	根据节点的类型定义值
nodeType	String	根据节点的类型定义类型
firstChild	Node	指向在childNodes列表中的第一个字节
lastChild	Node	指向在childNode列个表中的的最后一个字节
childNode	Node	所有子节点的列表
hasChildNodes	Boolean	当childNodes包含一个或多个节点时，返回真

*Node的接口还有很多，可以参考相应的API在这就不详细说明.

查找元素的方法：

可以通过很多种方法来查找想访问的节点，最常用的两种方法：

  1，通过使用 getElementById() 和 getElementsByTagName() 方法 

  2，通过使用一个元素节点的 parentNode、firstChild 以及 lastChild 属性 

**结束语：如何使用这两种方法，请关注DOM 总结（二）

<!--EndFragment-->