javascript .childNodes& 。孩子 [英] Difference between javascript .childNodes & .children
问题描述
我已经使用javascript工作了一个星期了。我目前正致力于通过节点使工作/改变。但是我注意到了一些奇怪的东西，对于一个不熟练的javascripter来说也是如此。
I have been working with javascript for a week now. I am currently working on making things work/change through nodes. But I have been noticing something strange, well for an unskilled javascripter it is.
我的网站结构如下：
<html>
<head>
<title>....</title>
<link/>
<script></script>
</head>
<body>
<div 1>
<div 2></div>
</div>
</body>
</html>
当我试图找到具有下一个函数的子节点时：
When I am trying to find a childnode with the next function:
var headerBox = document.body.childNodes;
var txt = "";
for (var x = 0; x < headerBox.length; x ++) {
txt =txt+"Childnode["+x+"]: "+headerBox[x].localName+" ("+headerBox[x].className+")<br>";
}
var x = document.getElementById(box);
x.innerHTML = txt;
我得到一个列表，其中有几个未定义的NULL加上现实DIV的
I get a list with a couple of undefined "NULL" coupled with the reali DIV's
但是，当我只是将document.body.childNodes更改为document.body.children时，一切都很完美，NULL值甚至会发生变化。
But when I simply change the "document.body.childNodes" to "document.body.children" everything comes uit perfectly, the "NULL" values even change.
我想知道HTML文件中NULL值代表什么，因为NULL值所在的元素没有。在我的头脑中，它给了我一些不存在的东西，可见，但却是......
What I am wondering is what does the "NULL" values represent in the HTML file, since there are no elements at where the "NULL" value is standing. In my head it is giving me a representation of something that is not there, visible, but yet it is...
有谁可以向我解释发生了什么事？
Could anyone please explain to me what is going on?
Ps：很抱歉可能转发这个但我找不到合适的其他问题！
Ps: I am sorry for maybe reposting this but I couldn't find a suitable other question regarding this matter!
Pss：找到一个转贴（ JavaScript中的children和childNodes有什么区别？）。但它没有回答为什么它仍然认为看不见的子节点是未定义的。
Pss: Found a repost (What is the difference between children and childNodes in JavaScript?). But it is not answering why it still recognizes unseen childnodes as undefined.
推荐答案
childNodes 将为您提供各种节点，而 children 将只为您提供元素节点。您可以使用 nodeType 来检查当前节点的节点类型：
childNodes will give you all kinds of nodes while children will give you only element nodes. You can use nodeType to check what kind of node the current node is:
document.body.childNodes[0].nodeType
这将给你一个整数：
1 ELEMENT_NODE
2 ATTRIBUTE_NODE
3 TEXT_NODE
4 CDATA_SECTION_NODE
5 ENTITY_REFERENCE_NODE
6 ENTITY_NODE
7 PROCESSING_INSTRUCTION_NODE
8 COMMENT_NODE
9 DOCUMENT_NODE
10 DOCUMENT_TYPE_NODE
11 DOCUMENT_FRAGMENT_NODE
12 NOTATION_NODE
如您所见，使用 childNodes 将为您提供一个包含文本节点的列表（即使它们填充了空白），注释和各种其他节点类型，您可能也不必过于担心。
As you can see, using childNodes will give you a list, that contains text nodes (even if they are filled with whitespaces), comments and all kinds of other node types, you probably don't have to worry too much about.
这篇关于javascript .childNodes& 。孩子的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
