English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
firstElementChild読み取り専用属性は指定された親要素の最初の子要素を返します。
親要素に子要素がない場合、このメソッドはnull値を取得します。
を使用してchildren属性を返します。children [0]はfirstElementChildと同じ結果を返します。
指定された親要素の最後の子要素を返すには、lastElementChild属性。
ParentElement.firstElementChild
<div>
<p>これはDIV中的第1個P</p>
<p>これはDIV中的第2個P</p>
<p>これはDIV中的第3個P</p>
</div>
<script>
var x = document.querySelector("div").firstElementChild.nodeName;
document.getElementById("result").innerHTML = x;
</script>テストして見て‹/›すべてのブラウザが完全にfirstElementChild属性をサポートしています：
| 属性 | |||||
| firstElementChild | は | は | は | は | は |
| 返却値： | 指定親要素の最初の子要素を表すNodeオブジェクト；子要素がない場合、null |
|---|---|
| DOMバージョン： | DOMレベル1 |
DIV要素の最初の子要素のHTML内容を取得します：
<div>
<p>これはDIV中的第1個P</p>
<p>これはDIV中的第2個P</p>
<p>これはDIV中的第3個P</p>
</div>
<script>
var x = document.querySelector("div").firstElementChild.textContent;
document.getElementById("result").innerHTML = x;
</script>テストして見て‹/›DIV要素の最初の子要素のHTML内容を変更します：
var div = document.querySelector("div");
div.firstElementChild.textContent = "HELLO WORLD";テストして見て‹/›HTML DOM 参考：lastElementChild属性