HTML中节点个数统计,文本节点NodeValue的取法

       在html的DOM模型中,要通过js取得某一个范围下的节点个数,节点个数=元素节点的个数+文本节点个数(元素节点标签内包含的文本)+1个空的文本节点。

<ul id="ul">

           <li>列表一</li>

           <li>列表二</li>

           <li>列表三</li>

</ul>

<script>

varul=document.getElementById("ul");

alert(ul.childNodes.length);//输出7,共有7个节点,其中3个元素li节点,3个元素li下面的文本节点,再加上一个元素ul的firstChild,1个空的文本节点。

</script>

 

      上面的示例中,是有3个元素节点,元素节点的包含的内容可以通过innerHTML来获取,获取的内容分别是 “列表一”“ 列表二”“ 列表三”

      

      4个文本节点,它们的内容可以通过文本节点的nodeValue属性,且nodeValue属性只有文本节点和属性节点才有的。


       但是要获取到文本节点并不是那么简单,文本节点是包含在元素标签内的,3个li元素节点包含了3个文本节点,还有一个ul元素节点包含一个空白文本节点,虽然通过ul的childNodes能取到文本节点,但ul.childNodes[文本节点的索引].nodeValue是无法取到文本节点的值。


       要取到文本节点的nodeValue,只能通过li元素节点的firstChild.nodeValue,才能取到。虽然ul的childNodes能够取到文本节点,但要取到文本节点的内容,则是要从文本节点的父节点——元素节点,该元素节点的firstChild.nodeValue才是文本节点的值。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值