Element对象的firstchild和lastChild获取属性值的undefined问题

来源：互联网发布：网络客服招聘编辑：程序博客网时间：2024/05/21 18:40

<html>
<head>
<title>HTML_CSSS</title>
<script type="text/javascript">
//
function getNodes() {
//得到li1(子节点)
//var liLabel = document.getElementById("li1");
//得到ul(父节点)
//var ulLabel = liLabel.parentNode;
//alert(ulLabel.id);

//获取ul的第一个子节点
//var ulLabel = document.getElementById("ulId");
//var firstChildNode = ulLabel.firstChild;
//alert(firstChildNode.id);//若果是undefined,则使用getElementByTagName()
//获取最后一个子节点
var ulLabel = document.getElementById("ulId");
var lastChildNode = ulLabel.lastChild;
alert(lastChildNode.id);
}
</script>
</head>
<body>
<ul id="ulId">
<li id="li1">aaa</li>
<li id="li2">qqq</li>
<li id="li3">eee</li>
<li id="li4">bbb</li>
</ul>
<input type="button" value="click here" onclick="getNodes()">
</body>

</html>

以上案例在fireFox是可行,没什么问题,但是在Google Chrome和IE却是undefined,并且打印一下lastChildNode 显示是Object Text,是因为在高级浏览器里面,通过前述API拿到的第一和最后一个子标签是文本标签(文本节点),跟childNodes属性类似,因此,我们在碰到这些状况的时候,还是不建议使用,建议透过getElementsByTagName()的方法获取子元素.

阅读全文

0 0