JavaScript の children と childNodes の違いは何ですか? 質問する

Question

だとわかる.childrenは、要素. ¹要素のみがを持ち.children、これらの子はすべて Element 型です。²

しかし、.childNodesのプロパティですノード..childNodes任意のノードを含めることができます^。3

具体的な例は次のようになります。

let el = document.createElement("div");
el.textContent = "foo";

el.childNodes.length === 1; // Contains a Text node child.
el.children.length === 0;   // No Element children.

ほとんどの場合、.childrenループしたくないので、文章またはコメントDOM 操作におけるノード。

テキストノードを操作したい場合は、おそらく.textContentまたは.nodeValue代わりに^。4

どちらを使用するかを決める前に、2 つの違いを理解することが重要です。プロパティは.textContentノードとその子孫のテキストコンテンツを表しますが、.nodeValueプロパティは現在のノードの値を表します。

^{1. 技術的には、それは親ノード、Elementに含まれるミックスイン。2}
^{. これらはすべて要素です.children。HTMLコレクションは、要素のみを含むことができます。3}
^{. 同様に、は、.childNodes任意のノードを保持できます。ノードリスト4.}
^{または.innerText違いを見てみようここまたはここ。}

Answer 1