Dom总结

来源:互联网 发布:linux启动2个tomcat 编辑:程序博客网 时间:2024/05/21 06:45

DOM: 

DOM= Document Object Model,文档对象模型,DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。换句话说,这是表示和处理一个HTMLXML文档的常用方法。有一点很重要,DOM的设计是以对象管理组织(OMG)的规约为基础的,因此可以用于任何编程语言.下面是一个文档的DOM结构

节点

根据 DOMHTML 文档中的每个成分都是一个节点。DOM 是这样规定的:

整个文档是一个文档节点 

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

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

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

注释属于注释节点 

Node接口的特性和方法

查找并访问节点

你可通过若干种方法来查找您希望操作的元素:

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

2通过使用一个元素节点的 parentNodefirstChild 以及 lastChild 属性 

查找元素节点

1getElementById() 

     寻找一个有着给定 id 属性值的元素,返回值是一个有着给定 id 属性值的元素节点。如果不存在这样的元素,它返回 null.例如:

var oElement = document.getElementById ( sID )

该方法只能用于 document 对象

2getElementsByName()

寻找有着给定name属性的所有元素,这个方法将返回一个节点集合,这个集合可以当作一个数组来处理。这个集合的 length 属性等于当前文档里有着给定name属性的所有元素的总个数。举例如下:

 3getElementsByTagName()

寻找有着给定标签名的所有元素,这个方法将返回一个节点集合,这个集合可以当作一个数组来处理。这个集合的 length 属性等于当前文档里有着给定标签名的所有元素的总个数。

   var elements = document.getElementsByTagName(tagName);

   var elements = element.getElementsByTagName(tagName);

该方法不必非得用在整个文档上。它也可以用来在某个特定元素的子节点当中寻找有着给定标签名的元素。

   var container =   document.getElementById(sid);

   var elements = container.getElementsByTagName(p);

   alert(elements .length);

4parentNodefirstChild以及lastChild

请看下面这个 HTML 片段:

<table>

<tr>

  <td>feng</td>

   <td>rui</td>

   <td>fang</td>

</tr>

</table>

在上面的HTML代码中,第一个 <td> 是 <tr> 元素的首个子元素(firstChild),而最后一个 <td> 是 <tr>元素的最后一个子元素(lastChild)。

此外,<tr> 是每个 <td>元 素的父节点(parentNode)。

5、查看是否存在子节点

hasChildNodes()

该方法用来检查一个元素是否有子节点,返回值是 true 或 false.

  var booleanValue = element.hasChildNodes();

文本节点和属性节点不可能再包含任何子节点,所以对这两类节点使用 hasChildNodes 方法的返回值永远是 false.

如果 hasChildNodes 方法的返回值是 false,则 childNodes,firstChild,lastChild 将是空数组和空字符串。

有两种特殊的文档属性可用来访问根节点:

document.documentElement 

document.body 

第一个属性可返回存在于 XML 以及 HTML 文档中的文档根节点。

第二个属性是对 HTML 页面的特殊扩展,提供了对 <body> 标签的直接访问

nodeName 属性含有某个节点的名称。

DOM属性---nodeName

var name = node.nodeName;

元素节点的 nodeName 是标签名称 

属性节点的 nodeName 是属性名称 

文本节点的 nodeName 永远是 #text 

文档节点的 nodeName 永远是 #document 

注释:nodeName 所包含的 XML 元素的标签名称永远是大写的

DOM属性---nodeType

nodeType:返回一个整数,这个数值代表着给定节点的类型。

nodeType 属性返回的整数值对应着 12 种节点类型,常用的有三种:

Node.ELEMENT_NODE    ---1    -- 元素节点

Node.ATTRIBUTE_NODE  ---2    -- 属性节点

Node.TEXT_NODE       ---3    -- 文本节点

nodeType 是个只读属性

原创粉丝点击