JavaScript学习——childNodes属性、nodeType属性

1.childNodes属性

在一颗节点树上，childNodes属性可以用来获取任何一个元素的所有子元素。它是一个包含这个元素全部子元素的数组

element.childNodes

假设我们现在需要把body的所有子元素检索出来，我们可以这么做：

<script>var body_element = document.getElementsByTagName("body");alert(body_element[0].childNodes);</script>

因为每份文档中只有一个body元素，所以也是getElementsByTagName方法所返回的数组的第一个

使用数组的length属性就可以知道它所包含的元素的个数：

alert(body_element[0].childNodes.length);

我想让这个函数在页面加载的时候执行，而这需要使用onload事件处理函数。下面这条语句添加到代码段的末尾:

function maoxian(){var body_element = document.getElementsByTagName("body");alert(body_element[0].childNodes);}window.onload = maoxian();

这条语句的作用是在页面加载的时候调用maoxian函数。

2.nodeType属性

上面的maoxian()函数给出的数字可能会让你大吃一惊。这是因为文档中的节点类型并非元素节点一种。由chileNodes属性返回的数组包含所有类型的节点，而不仅仅是元素节点。事实上，文档里几乎每一样东西都是一个节点，甚至连空格和换行符都会被解释成节点，而它们也全部包含在childNodes属性返回的数组中。因此maoxian()返回的结果才这么大。

还好，每一个节点都有一个nodeType属性。这个属性可以让我们知道自己正在与哪一种节点打交道。

用下面的语法获取节点的nodeType属性：

node.nodeType

nodeType的值是一个数字而不是英文字符串。

为了验证这一点，把maoxian中的alert语句替换为下面这一条语句，这样一来我们就可以知道body_element元素的nodeType属性了：

alert(body_element.nodeType);

在web浏览器中刷新，将看到显示数字“1”的对话框，换句话说，元素节点的nodeType属性值是1.

nodeType属性总共有12种可取值，但其中仅有3种具有使用价值：

（1）元素节点的nodeType属性值是1。

（2）属性节点的nodeType属性值是2。

（3）文本节点的nodeType属性值是3。

这就意味着，可以让函数只对特定类型的节点去处理。例如，完全可以编写出一个只处理元素节点的函数。