DOM学习笔记2： DOM的几个新属性

本节主要学习几个DOM的属性：

• ChildNodes
• nodeType
• nodeValue
• firstChild
• lastChild

1.ChildNodes 子元素集合 ，这是一个数组，比如我们要取得一篇html里的body元素的全体子元素的总数：

 

var body_element = document.getElementsByTagName("body")[0];

alert(body_element.childNodes.length);

 

2.nodeType 子元素类型  nodeType 共有12种可取值，不过只有3种有实用价值 1.元素节点 2.属性节点 3.文本节点

比如：alert(body_element.nodeType);

将弹出“1”的提示框

 

3.nodeValue 元素值  我们通常可以用它来获取/改变文本节点的文本内容

比如html中有一段： <p id="mx440">this is a test</p>

这时，如果我们需要获得"this is a test"这段内容，应该怎么办?

一般情况下我们想当然会用以下写法：

var mx440 =document.getElementById('mx440');

alert(mx440.nodeValue);

结果返回是 null. 这是因为在<p>节点里，它的文本内容又是它的另一个节点，因此，我们必须得用以下写法：

 

mx440.childNodes[0].nodeValue; 这样才会返回我们想要的文本内容。

 

4.firstChild和lastChild

这个很容易理解，firstChild就是和childNodes[0]是相同的效果；lastChild就是 node.childNodes[node.childNodes.length-1]；

其实也只是增加了程序的可读性。