子ノードを取得する最良の方法
JavaScriptには、任意の要素から最初の子要素を取得するためのさまざまなメソッドが用意されていますが、どれが最適ですか。つまり、動作に関しては、ブラウザ間の互換性が最も高く、高速で、包括的で、予測可能です。エイリアスとして使用するメソッド/プロパティのリスト: var elem = document.getElementById('container'); var child = elem.children[0]; var child = elem.firstElementChild; // == children[0] これはどちらの場合でも機能します。 var child = elem.childNodes[0]; // or childNodes[1], see below これは、フォームまたは<div>反復の場合です。テキスト要素に遭遇する可能性がある場合: var child = elem.childNodes; // treat as NodeList var child = elem.firstChild; 私ができる限り、firstChildからのNodeList childNodesをfirstElementChild使用し、を使用しchildrenます。私はこの仮定をMDNリファレンスに基づいています。 childNode要素ノードの最初の子要素への参照、またはnull存在しない場合。 速度の点では、firstElementChildは事実上への参照children[0]であり、childrenオブジェクトはすでにメモリ内に既に存在するため、違いがあってもほとんどありません。 私を投げるのはchildNodesオブジェクトです。これを使用して、テーブル要素のフォームを確認しました。childrenはすべてのフォーム要素をリストchildNodesしていますが、HTMLコードの空白も含まれているようです。 console.log(elem.childNodes[0]); console.log(elem.firstChild); 両方のログ <TextNode textContent="\n "> …