妖灵262
2016-11-12 17:10
var temp=document.getElementsByTagName("div")[0].childNodes;
这里的【0】怎么解释?
<!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]变成[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++),,,,什么才叫做子节点呢?麻烦解答一下,感激不尽!
这里有两个div;所以用到了索引,找到我们想要的div
这里的【0】是指选择第一个div,你可以尝试下在html中多些几个平行的div结构,如此,下面代码:
var temp=document.getElementsByTagName("div")[1].childNodes;
这里【0】变成了【1】,就是针对第二个div来进行相应的操作了(访问第二个div的字节点)。
0表示是第一个子节点,因为一组数的开始第一项是从0开始,比如一个含有四个节点的元素x,那么它的每个子节点的顺序是x[0],x[1],x[2],x[3]
JavaScript进阶篇
468192 学习 · 21891 问题
相似问题