Question

js获取子节点的方法

<ul>

<li>
<span></span>
<div></div>
<div>隐藏</div>
<div></div>
<span></span>
</li>
<li>
<span></span>
<div></div>
<div>隐藏</div>
<div></div>
<span></span>
</li>
<li>
<span></span>
<div></div>
<div>隐藏</div>
<div></div>
<span></span>
</li>
</ul>

我需要的效果是当鼠标经过li的时候写着隐藏的div显示，其他不变，鼠标移开后，div隐藏
我已经写了var oLi = document.getElementsByTagName('li');
再写 var oDiv = oLi.getElementsByTagName('div');报错了，请问是什么原因，要怎么才可以获得li下面的div,实现效果，请用Javascript 谢谢，初学者

Answer 1

你的oLi是所有li的集合，所以你使用oLi的时候应该加下标，才能表示你使用的 是 哪个li
所以

var oDiv = oLi[此处是下标].getElementsByTagName('div');

追问

额，那这样的话是不是var oDiv = oLi[此处是下标].getElementsByTagName('div');这句话要放在for循环里面

追答

是的.getName或者TagName或者ClassName都是一个集合，都要加下标。不然要报错

Answer 2

1.可以使用childNotes方法：
2.定义和用法：
childNodes 属性返回节点的子节点集合，以 NodeList 对象。
3.实例：获得 body 元素的子节点集合：
document.body.childNodes;

Answer 3

需要的完整代码如下

html文件
<li onmouseover= showOrHide ('hidden','block')
onmouseout= showOrHide ('hidden','none')>
<div id="hidden">隐藏</div>
</li>
js函数
<script type="text/javascript">
function showOrHide (id,dp) {
document.getElementById(id).style.display=dp;
}
</script>