HTML DOM Element lastChild属性
- 前のページ lang
- 次のページ lastElementChild
- 上一层に戻る HTML DOM Elements オブジェクト
定義と使用法
lastChild 属性は指定されたノードの最後の子ノードをNodeオブジェクトとして返します。
lastChild 属性は読み取り専用です。
注意
lastChild 返されるのはこれらの子ノード：要素ノード、テキストノード、またはコメントノードです。
要素間の空白もテキストノードです。
代替案：
lastElementChild属性 - lastElementChild 属性は最後の子要素（テキストノードやコメントノードを無視）を返します。
参照してください：
ノード属性
ノードと要素
HTML HTML DOM（ドキュメントオブジェクトモデル）では、HTMLドキュメントは子ノード（または子ノードがない）を持ちます。
ノード要素ノード、テキストノード、およびコメントノードを指します。
要素要素間の空白もテキストノードです。
要素はただの要素ノードです。
子ノードと子要素
childNodes 返します子ノード（要素ノード、テキストノード、およびコメントノード）。
children 返します子要素（テキストノードやコメントノードではなく）。
firstChild と firstElementChild
firstChild 最初のものを返します子ノード（要素ノード、テキストノード、またはコメントノード）。要素間の空白もテキストノードです。
firstElementChild 最初のものを返します子要素（テキストノードやコメントノードは返されません）。要素間の空白もテキストノードです。
lastChild と lastElementChild
lastChild 最後のものを返します子ノード（要素ノード、テキストノード、またはコメントノード）。要素間の空白もテキストノードです。
lastElementChild 最後のものを返します子要素（テキストノードやコメントノードは返されません）。要素間の空白もテキストノードです。
インスタンス
例 1
<ul>要素の最後の子ノードのHTMLコンテンツを返します：
document.getElementById("myList").lastChild.innerHTML;
例 2
<select>要素の最後の子ノードのテキストを取得する：
let text = document.getElementById("mySelect").lastChild.text;
例 3
この例ではスペースの干渉を示しています。"myDIV"の最後の子ノードのノード名を取得しようと試みます：
<div id="myDIV">
<p>最初の子供のように見えます</p>
<p>最後の子供のように見えます</p>
</div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>
例 4
しかし、ソースからスペースを削除すると、「myDIV」には #text ノードがありません：
<div id="myDIV"><p>最初の子供</p><p>最後の子供</p></div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>
構文
element.lastChild
または
node.lastChild
返り値
| タイプ | 説明 |
|---|---|
| ノード | ノードの最後の子ノード。 |
| null | 子がいない場合。 |
ブラウザのサポート
element.lastChild DOM Level 1 (1998) の機能です。
すべてのブラウザで完全にサポートされています：
| Chrome | IE | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| Chrome | IE | Edge | Firefox | Safari | Opera |
| サポート | 9-11 | サポート | サポート | サポート | サポート |
- 前のページ lang
- 次のページ lastElementChild
- 上一层に戻る HTML DOM Elements オブジェクト
