                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

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

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

这里的【0】怎么解释？

妖灵262

2016-11-12

源自：JavaScript进阶篇 9-8

关注问题我要回答

1328

操作

收起

5 回答

水墨墨心回答被采纳 +3 积分
2016-11-15

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
<div>
  javascript  
  <p>javascript</p>
  <div>111</div>
  <h5>PHP</h5>
</div>
<div>
  哈哈哈  
  <p>javascript</p>
  <div>333</div>
  <h5>PHP</h5>
</div>
<div>
  哼哼  
  <p>javascript</p>
  <div>555</div>
  <h5>PHP</h5>
</div>
<script type="text/javascript">
 var x=document.getElementsByTagName("div")[3].childNodes;
 for(var i=0;i<x.length;i++)
 {
    document.write("第"+(i+1)+"个节点的值是："+x[i].nodeValue+"<br  />"); 
    document.write("第"+(i+1)+"个节点的名称是："+x[i].nodeName+"<br  />"); 
    document.write("第"+(i+1)+"个节点的属性是："+x[i].nodeType+"<br  />");
    document.write("<br  />");
 }
</script>
</body>
</html>

参考以上代码，[3]选择的是第4个div，即 <div>333</div>。

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

#1

妖灵262 提问者

非常感谢！

2016-11-21 回复有任何疑惑可以回复我~

qq_火兹_03896205
2016-12-28

我也是这样认为的，但我有个问题：当[0]变成[3]时，即<div>333</div>那么后面的.childNodes究竟访问的是什么呢？专指<div>333</div>这个节点，还是6个div节点，我运行的结果是

第1个节点的值是：333

第1个节点的名称是：#text

第1个节点的属性是：3

所以我觉得专指<div>333</div>这个节点，那么问题又来了，为啥还要加for的遍历呢？for(var i=0;i<x.length;i++)，，，，什么才叫做子节点呢？麻烦解答一下，感激不尽！

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

慕村1994845
2016-12-10

这里有两个div；所以用到了索引，找到我们想要的div

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

水墨墨心
2016-11-14

这里的【0】是指选择第一个div，你可以尝试下在html中多些几个平行的div结构，如此，下面代码：

var temp=document.getElementsByTagName("div")[1].childNodes;

这里【0】变成了【1】，就是针对第二个div来进行相应的操作了（访问第二个div的字节点）。

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

#1

不好意思，回答错误了。

2016-11-14 回复有任何疑惑可以回复我~

慕粉4013878
2016-11-12

0表示是第一个子节点，因为一组数的开始第一项是从0开始，比如一个含有四个节点的元素x，那么它的每个子节点的顺序是x[0],x[1],x[2],x[3]

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

举报

0/150

提交

取消

JavaScript进阶篇

参与学习 468044 人
解答问题 21891 个

本课程从如何插入JS代码开始，带您进入网页动态交互世界

本课相似问答

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

3 回答var a=document.getElementsByTagName("div")[0].childNodes;

6 回答var nd=document.getElementsByTagName("div")[0].childNodes;

2 回答var node=document.getElementsByTagName("div")[0].childNodes

2 回答var t=document.getElementsByTagName("div")[0].childNodes里的[0]

搜索更多本课相关问答

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

我要回答关注问题

意见反馈帮助中心 APP下载