[解決済み] JavaScriptのchildrenとchildNodeの違いは何ですか？

質問

JavaScriptを使用していて、以下のようなことに遭遇しました。 childNodes と children プロパティを使用します。両者の違いは何なのか気になるところです。また、どちらかが優先されるのでしょうか？

解決方法は？

を理解する .children のプロパティです。 要素 . ¹ 要素のみ .children であり、これらの子要素はすべてElement型である。 ²

しかし .childNodes のプロパティです。 ノード . .childNodes は任意のノードを含むことができます。 ³

具体的な例を挙げると、次のようになります。

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 の代わりに ⁴

<sup>1. 技術的には 親ノード Elementに含まれるミキシンである。
2. それらはすべて要素であるため .children は HTMLCollection 要素のみを含むことができます。
3. 同様に .childNodes であるため、任意のノードを保持することができます。 ノードリスト .
4. または .innerText . 違いを見る こちら または こちら .</sup>