Proprietà lastChild dell'elemento HTML DOM

Definizione e uso

lastChild L'attributo restituisce l'ultimo nodo figlio del nodo specificato come oggetto Node.

lastChild L'attributo è readonly.

Attenzione

lastChild Restituisce questi nodi figli: nodi di elemento, nodi di testo o nodi di commento.

Gli spazi bianchi tra gli elementi sono anche nodi di testo.

Soluzione alternativa:

Proprietà lastElementChild - lastElementChild Proprietà che restituisce l'ultimo elemento figlio (ignorando i nodi di testo e i nodi di commento).

Vedi anche:

proprietà childNodes

proprietà firstChild

proprietà nextSibling

proprietà previousSibling

Proprietà del nodo

proprietà parentNode

proprietà nodeName

proprietà nodeType

proprietà nodeValue

Nodi HTML e elementi

In HTML DOMnel (Document Object Model), l'HTML documento è una raccolta di nodi che possiedono (o non possiedono) nodi figli.

NodoSi riferisce ai nodi di elemento, nodi di testo e nodi di commento.

ElementoGli spazi bianchi tra di essi sono anche nodi di testo.

mentre l'elemento è solo un nodo di elemento.

I nodi figli e i nodi figli elementi

childNodes RestituisceFiglio(nodi di elemento, nodi di testo e nodi di commento)。

children RestituisceFiglio(piuttosto che nodi di testo e commenti)。

firstChild e firstElementChild

firstChild Restituisce il primoFiglio(Nodo di elemento, nodo di testo o nodo di commento). Gli spazi tra gli elementi sono anche nodi di testo.

firstElementChild Restituisce il primoFiglio(Non restituisce nodi di testo e commenti).

lastChild e lastElementChild

lastChild Restituisce l'ultimoFiglio(Nodo di elemento, nodo di testo o nodo di commento). Gli spazi tra gli elementi sono anche nodi di testo.

lastElementChild Restituisce l'ultimoFiglio(Non restituisce nodi di testo e commenti).

Esempio

Esempio 1

Restituisce il contenuto HTML dell'ultimo figlio del nodo di un elemento <ul>:

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

Prova da solo

Esempio 2

Ottieni il testo dell'ultimo figlio del nodo di un elemento <select>:

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

Prova da solo

Esempio 3

Questo esempio dimostra l'interferenza degli spazi, prova a ottenere il nome del nodo dell'ultimo figlio di "myDIV":

<div id="myDIV">
  <p>Sembra essere il primo figlio</p>
  <p>Sembra essere l'ultimo figlio</p>
</div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>

Prova da solo

Esempio 4

Ma se rimuovi gli spazi dal sorgente, non c'è il nodo #text in "myDIV":

<div id="myDIV"><p>Primo figlio</p><p>Ultimo figlio</p></div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>

Prova da solo

Sintassi

element.lastChild

o

node.lastChild

Valore di ritorno

Tipo Descrizione
Nodo L'ultimo figlio del nodo.
null Se non ci sono figli.

Supporto dei browser

element.lastChild È una caratteristica di DOM Level 1 (1998).

Tutti i browser lo supportano completamente:

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