<body><div id="con"> <p>javascript</p> <div>jQuery</div> <h5>PHP</h5></div><script type="text/javascript">var x=document.getElementById("con"); document.write(x.firstChild.nodeName); document.write(x.lastChild.nodeName);</script></script></body></html>
5 回答
柠檬酸钠
TA贡献331条经验 获得超534个赞
由于div#con和p之间有空格，在Chrome浏览器中空格是一个#text文本节点（大概是这样吧），如果这段代码在IE中执行就不会出现这种情况了。为了浏览器兼容可以使用这个函数
function getChildren (ele) {
var children = ele.childNodes;
var arr = [];
for (var i = 0; i < children.length; i++) {
if (children[i].nodeType == 1) {
arr.push(children[i]);
}
}
return arr;
}获取#con下面的第一个p元素
var p = getChildren(document.getElementById('con'))[0];
alert(p); //[object HTMLParagraphElement]
woshi123w
TA贡献15条经验 获得超10个赞
<div id="con"><div>jQuery</div><p>javascript</p><h5>PHP</h5></div>
去掉节点之间的空白
Cassie_yu
TA贡献22条经验 获得超15个赞
除IE外，其余浏览器中 节点之间的空白符是文本节点。
所以，以上代码中 id=con 的子节点总共有七个，分别为 空白节点、P、空白节点、DIV、空白节点、H5、空白节点。
PS：仔细看 9-8 访问子节点childNodes中的内容。
添加回答
举报
0/150
提交
取消