问题描述:希望实现toggle效果(也称数据钻取),点击一下链接列表链接,展开此链接下的其他链接列表,再点击一下链接列表隐藏。实现办法有多种:一种是用jquery效果更丰富一些。另一种是直接CSS+Js。我用的是后一种方法。
<html>
<head>
<script type="text/javascript">
function getElements()
{
var x=document.getElementsByName("myInput");
alert(x.length);
}
</script>
</head>
<body>
<table>
<tr name="myInput"><td></td></tr>
<tr name="myInput"><td></td></tr>
<tr name="myInput"><td></td></tr>
<tr name="myInput"><td></td></tr>
</table>
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<br />
<input type="button" onclick="getElements()" value="名为 'myInput' 的元素有多少个?" />
</body>
</html>
结论:
IE不支持table中tr的name属性,使得document.getElementsByName不能获取到对应的tr元素,仅可以使用document.getElementById获取。
解决办法:
1. 因此如果想获取一系列相同名称的tr只可以通过命名方式,使用document.getElementById遍历需要访问的元素。
2. 直接不用table,全部改用div或者ul展示链接列表。