HTML元素节点及节点类型怎么数？

HTML元素节点：

##element.childNodes怎么数个数？

提示：如果标签的嵌套违反了嵌套规则，那么在计算子节点的时候可能怎么算都算不对的

---

初级

//先写一个块元素
<div></div> 这个块元素有1个子节点，子节点类型为3（文本类型）。
//这样
<div>dvdv</div>
//这样
<div>dvdv
</div>、
//还是这样
<div>
    dvdvdv
</div>
//childNodes都只有1个文本类型的子节点。

中级

//现在开始仔细数
<div>dvdv<p>p1</p></div>//这样的话在原来的div元素里又添加了一个p的元素节点所以childNodes.length是2

//但是这样
<div>dvdv<p>p1</p>
</div>
//在p元素的结束标签后面加上换行，div元素的childNodes.length就会多一个文本类型的子节点。

//这样
<div>dvdv
    <p>p1</p>
</div>
//和上面的是一样的。

高级

<div>dvdv<p>p1</p><p>p2<span>span1</span></p></div>
//子节点数为3 ----蒙了吧。（div元素有两个p1和p2并列的子元素节点和一个本身的文本节点，至于p2里的span元素，它不是和p1，p2并列的元素，所以不能算是div的子节点，可能是孙子节点。而且p1节点的末尾标签后面没有换行，p2节点的末尾标签后面也没有换行所以是---一个div本身的文本节点，和两个元素节点一共3个）。

//****现在加上换行
<div>dvdv
    <p>p1</p><p>p2</p>
</div>
//这样的话节点数就变为了4个啊，首先dvdv后面有个换行这个换行是不计数的，一般情况下换行会被计为一个文本节点，dvdv就是一个文本节点所以dvdv后面的换行是不作为文本节点计数的。比上个例子多出来的一个节点就是p2便签末尾的那个换行，记为文本节点。

//****最后来个实战
<div>
    <p>p1</p>
    <p id = 'p2'>
        <span>---span---</span>
    </p>
</div>

你答对了吗？

来看看这个div块共有几个子节点
首先div本身有个文本节点（不管它会不会像上面的例子那样有显示的dvdv文本），接着p1一个元素节点，p1标签末尾的换行是又一个文本节点，还有id为p2的元素节点，以及p2末尾的换行又是一个文本节点，至此div的子节点已经数完了。一共5个子节点，至于p2内部的span那是div的孙子节点了不能算在div的子节点里的。

HTML元素节点类型：

数完HTML元素节点还有HTML元素节点类型可以数~

document.body.nodeType怎么数个数？

提示： nodeType 属性返回以数字值返回指定节点的节点类型。

---

这里的数元素节点方法跟上面相同。