HTML DOM firstChild 属性

HTML DOM Element オブジェクト

firstChild読み取り専用の属性は、指定されたノードの最初の子ノードをNodeオブジェクトとして返します。

指定されたノードに子ノードがない場合、このメソッドは空値。

要素内の空白はテキストとして、テキストはノードとして、コメントもノードとして見なされます。

firstChildが#textや#commentノードを返す問題を避けるために、firstElementChild最初の要素ノードのみを返します。

指定されたノードの最後の子ノードを返すには、lastChild属性。

文法：

node.firstChild

<div>
　　　<p>これはDIV内の第1個P</p>
　　　<p>これはDIV内の第2個P</p>
　　　<p>これはDIV内の第3個P</p>
</div>
<script>
var　x　=　document.querySelector("div").firstChild.nodeName;
document.getElementById("result").innerHTML　=　x;
</script>

しかし、DIVと最初のP要素間のスペースを削除すると、戻り値はPタグではなく#textになります：

<div><p>これはDIV内の第1個P</p>
　　　<p>これはDIV内の第2個P</p>
　　　<p>これはDIV内の第3個P</p>
</div>
<script>
var　x　=　document.querySelector("div").firstChild.nodeName;
document.getElementById("result").innerHTML　=　x;
</script>

ブラウザの互換性

すべてのブラウザが完全にfirstChild属性をサポートしています：

技術的詳細

関連リファレンス

HTML DOM リファレンス：node .lastChild属性

HTML DOM リファレンス：node .childNodes属性

HTML DOM リファレンス：node .parentNode属性

HTML DOM リファレンス：node .nextSibling属性

HTML DOM リファレンス：node .previousSibling属性

HTML DOM リファレンス：node .nodeName属性

HTML DOM Element オブジェクト