document.getElementsByTagName("div")[...

document.getElementsByTagName("div")[0].childNodes的下标[0]是啥意思

<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("div子节点个数："+node.length+"<br />"); for(var i=0;i<node.length;i++){ document.write("节点类型："+node[i].nodeType+"<br />"); }</script>请问以上代码获取div标签属性为啥要用[0]下标？谢谢！

查看完整描述

4 回答

已采纳

llwanghong

TA贡献7条经验获得超9个赞

document.getElementsByTagName("div")[0].childNodes

所有类似 getElementsXXX 这种获取节点的方法都是返回节点的数组，从名字也可以看出，所以上面就是获取返回节点数组的第一个元素，然后得到它所有的子节点，可以和 getElementById 对比理解记忆，这个从名字可以看出，只获得一个唯一的节点。

2 反对回复 2016-09-08

qq_风华青春_03784766
我把代码修改了如下： <body> <div> javascript <p>javascript</p> <div>jQuery</div> <h5>PHP</h5> </div> <ul> <li>javascript</li> <li>jQuery</li> <li>PHP</li> </ul> <script type="text/javascript"> var node=document.getElementsByTagName("div")[1].childNodes;//获取第二个"div"标签元素的字节点 document.write("div子节点个数："+node.length+"<br />"); for(var i=0;i<node.length;i++){ document.write("节点类型："+node[i].nodeType+"<br />"); } 运行结果是： div子节点个数：1 节点类型：3 问题：<div>jQuery</div> 标签元素没有子节点，怎么会有返回结果。谢谢！

回复 2016-09-08
llwanghong
nodeType为3，代表这是个文本节点(textNode)，即指的是jQuery，你理解的子节点可能紧局限于nodeType为1的元素节点(elementNode)，可以看下节点类型，包括很多种的

回复 2017-04-05
llwanghong
还有上面我说的返回节点的数组不准确，准确来说应该是返回节点的列表，应该这些方法返回的都是nodeList，类数组，并不是真正的数组，需要通过Array.prototype.slice.call(nodeList)来转一下的

回复 2017-04-05