javascript 获取子节点children与childNodes的区别

1.例如一段代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>

<div id="box">
  <span>box</span>
</div>

<script>

  var box = document.getElementById('box');
  console.log(box.childNodes.length); //3个
  console.log(box.children.length); //1个

</script>
</body>
</html>

box.childNodes.length 显示为3个,这是因为

childNodes它会把空的文本节点当成节点div和span中间是有空格的 前面一个,后面一个就是三个。

而另一种方法children就不用担心它只显示元素节点即使是非空的文字节点也不显示。所以显示为1个

注意这里的写法children和childNodes

 

posted on 2020-06-06 00:55  令狐大虾  阅读(221)  评论(0)    收藏  举报