本文探讨了JavaScript中firstChild、childNodes[0]和children[0]在获取元素第一个子节点时的区别。在包含换行的情况下，firstChild和childNodes[0]会将换行视为文本节点，而children[0]则忽略文本节点，直接获取HTML元素节点。去除换行后，三种方法都能正确获取第一个元素节点。需要注意，children属性虽方便但并不标准，标准方法为firstChild和childNodes。
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js中firstChild和childNodes[0]以及children[0]之间的点滴问题</title>
</head>
<body>
<div id="div1">
<p>
pppppppppppppppp
</p>
</div>
<script type="text/javascript">
window.onload = function() {
if (!document.getElementById("div1")) return false;
var div1 = document.getElementById("div1");
console.log(div1.firstChild);
console.log(div1.firstChild.nodeType);
console.log(div1.childNodes[0]);
console.log(div1.childNodes[0].nodeType);
console.log(div1.children[0]);
console.log(div1.children[0].nodeType);
console.log(document.getElementsByTagName("p")[0].firstChild.nodeValue);
};
</script>
</body>
</html>
运行结果入下：
最低0.47元/天 解锁文章
496
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
