为了账号安全,请及时绑定邮箱和手机立即绑定

请问各位大神:为什么下面这段代码中的第一个<div>会有7个子节点呢?不应该是“文本:javascript”、“元素p”、“元素div”、“元素h5”这4个子节点吗?

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

</head>

<body>

<div>

  javascript  

  <p>javascript</p>

  <div>jQuery</div>

  <h5>PHP</h5>

</div>

<script type="text/javascript">

var node=document.getElementsByTagName("div")[0].childNodes;

var huoqu=document.getElementsByTagName("div")[0].childNodes;

 for (var i=0;i<huoqu.length;i++)

     {document.write("第"+(i+1)+"个子节点的名称:"+huoqu[i].nodeName+"<br/>");

      document.write("第"+(i+1)+"个子节点的值:"+huoqu[i].nodeValue+"<br/>");

      document.write("第"+(i+1)+"个子节点的类型:"+huoqu[i].nodeType+"<br/><br/><br/>");

     }

</script>

</body>

</html>



正在回答

3 回答

看你用的什么浏览器。childNode 在 ie 和 firefox 中有着不同的处理方式,ie 只会把 html 标签算作孩子结点,而 firefox 除了把 html 标签算作孩子结点外,还会把“文字、空格、换行符和制表”算作孩子结点,三个元素标签,加四个换行,刚好七个

2 回复 有任何疑惑可以回复我~
#1

子玲儿 提问者

非常感谢哈!
2017-04-04 回复 有任何疑惑可以回复我~
#2

Daniel大牛D 回复 子玲儿 提问者

抱歉 我不同意上面最佳回答的观点。 并不是4个换行+3个元素=7个。实际是3个换行+1个文本标签+3个元素标签。因为换行,空格等在非IE浏览器下,都会认为是空文本标签。那么在已经有一个非空文本标签存在的情况下,不管是在这个空文本标签的前面还是后面有任何空标签,都会被忽略。请参考后面代码进行验证。
2017-06-25 回复 有任何疑惑可以回复我~

<div


  javascript 

  <p>javascript</p>

  <div>jQuery</div>

  <h5>PHP</h5>

</div>

<script type="text/javascript">

 var node = document.getElementsByTagName("div")[0].childNodes;

 document.write("Number of nodes:"+ node.length + "<br/>")

 for(var i = 0; i < node.length; i++){

     document.write("Node type:"+ node[i].nodeType + "<br/>")

     document.write("Node type:"+ node[i].nodeValue + "<br/>")

 }


0 回复 有任何疑惑可以回复我~
#1

Daniel大牛D

抱歉笔误,最后一行的“Node type” 应该改成“Node value”
2017-06-25 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

请问各位大神:为什么下面这段代码中的第一个<div>会有7个子节点呢?不应该是“文本:javascript”、“元素p”、“元素div”、“元素h5”这4个子节点吗?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信