HTML DOM Element lastChild eigenschap

Definitie en gebruik

lastChild 属性返回指定节点的最后一个子节点,以 Node 对象。

lastChild 属性是只读的。

Opmerking

lastChild 返回的是这些子节点:元素节点、文本节点或注释节点。

元素之间的空白也是文本节点。

Alternatieve oplossing:

lastElementChild eigenschap - lastElementChild 属性返回最后一个子元素(忽略文本和注释节点)。

Zie ook:

childNodes eigenschap

firstChild eigenschap

nextSibling eigenschap

previousSibling eigenschap

节点属性

parentNode eigenschap

nodeName eigenschap

nodeType eigenschap

nodeValue eigenschap

HTML 节点与元素

in HTML DOM(文档对象模型)中,HTML 文档是拥有(或没有)子节点的节点集合。

Knoop指的是元素节点、文本节点和注释节点。

元素之间的空白也是文本节点。

而元素只是元素节点。

子节点与子元素

childNodes TerugSubknooppunten(元素节点、文本节点和注释节点)。

children TerugSubelementen(而不是文本和注释节点)。

firstChild en firstElementChild

firstChild Terug de eersteSubknooppunten(elementknooppunten, tekstknooppunten of annotatieknooppunten). De witruimte tussen elementen is ook een tekstknooppunt.

firstElementChild Terug de eersteSubelementen(tekstknooppunten en annotatieknooppunten worden niet geretourneerd).

lastChild en lastElementChild

lastChild Retourneer de laatsteSubknooppunten(elementknooppunten, tekstknooppunten of annotatieknooppunten). De witruimte tussen elementen is ook een tekstknooppunt.

lastElementChild Retourneer de laatsteSubelementen(tekstknooppunten en annotatieknooppunten worden niet geretourneerd).

Voorbeeld

Voorbeeld 1

Retourneer de HTML-inhoud van de laatste subnode van het <ul>-element:

document.getElementById("myList").lastChild.innerHTML;

Probeer het zelf

Voorbeeld 2

Verkrijg de tekst van de laatste subnode van de <select>-element:

let text = document.getElementById("mySelect").lastChild.text;

Probeer het zelf

Voorbeeld 3

Dit voorbeeld toont de verstorende werking van spaties, probeer de naam van de laatste subnode van "myDIV" te verkrijgen:

<div id="myDIV">
  <p>Lijkt op eerste kind</p>
  <p>Lijkt op laatste kind</p>
</div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>

Probeer het zelf

Voorbeeld 4

Maar als je de spaties verwijdert van de bron, is er geen #text-knooppunt in "myDIV":

<div id="myDIV"><p>Eerste kind</p><p>Laatste kind</p></div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>

Probeer het zelf

Syntax

element.lastChild

of

node.lastChild

Retourwaarde

Type Beschrijving
Knoop De laatste subnode van het knooppunt.
null Als er geen kinderen zijn.

Browserondersteuning

element.lastChild is een DOM Level 1 (1998) kenmerk.

Alle browsers ondersteunen het volledig:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Ondersteuning 9-11 Ondersteuning Ondersteuning Ondersteuning Ondersteuning