HTML DOM Element lastChild-ominaisuus

Määritelmä ja käyttö

lastChild Ominaisuus palauttaa määritellyn solmun viimeisen lapsisolmun Node-objektina.

lastChild Ominaisuus on lukuinen.

Huomaa

lastChild Palauttaa nämä lapsisolmut: elementti-nodot, tekstinodeja tai kommenttinodeja.

Välit elementtien välillä ovat myös tekstinodeja.

Vaihtoehto:

lastElementChild-ominaisuus - lastElementChild Ominaisuus palauttaa viimeisen lapsielementin (jättäen teksti- ja kommenttinodeja huomiotta).

Lisätietoja:

childNodes-ominaisuus

firstChild-ominaisuus

nextSibling-ominaisuus

previousSibling-ominaisuus

Solmun ominaisuudet

parentNode-ominaisuus

nodeName-ominaisuus

nodeType-ominaisuus

nodeValue-ominaisuus

HTML-nodet ja elementit

HTML HTML DOM((Dokumentimalli)ssä, HTML-dokumentti on solmun joukko, jolla on (tai ei ole) lapsisolmuja.

SolmuTarkoittaa elementti-nodoa, tekstinodeja ja kommenttinodeja.

ElementtiVälit space-merkeillä ovat myös tekstinodeja.

Elementti on vain elementti-nodo.

Lapset ja lapsielementit

childNodes PalauttaaLapsisolmu((elementti-nodet, tekstinodeja ja kommenttinodeja)).

lapset PalauttaaLapsisolmu((ei teksti- tai kommenttinodeja)).

firstChild ja firstElementChild

firstChild Palauttaa ensimmäisenLapsisolmu(Elementtisolmu, tekstisolmu tai kommenttisolmu). Elementtien väliset tyhjät tilat ovat myös tekstisolmuja.

firstElementChild Palauttaa ensimmäisenLapsisolmu(Ei palauta tekstisolmuja tai kommenttisolmuja).

lastChild ja lastElementChild

lastChild Palauta viimeinenLapsisolmu(Elementtisolmu, tekstisolmu tai kommenttisolmu). Elementtien väliset tyhjät tilat ovat myös tekstisolmuja.

lastElementChild Palauta viimeinenLapsisolmu(Ei palauta tekstisolmuja tai kommenttisolmuja).

Esimerkki

Esimerkki 1

Palauta <ul>-elementin viimeisen lapsisolmun HTML-sisältö:

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

Kokeile itse

Esimerkki 2

Hanki <select>-elementin viimeisen lapsisolmun teksti:

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

Kokeile itse

Esimerkki 3

Tämä esimerkki osoittaa tyhjien tilojen häiritsevän, yritä saada "myDIV" viimeisen lapsisolmun solmunimi:

<div id="myDIV">
  <p>Näyttää ensimmäiseltä lapselta</p>
  <p>Näyttää viimeiseltä lapselta</p>
</div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>

Kokeile itse

Esimerkki 4

Mutta jos poistat tyhjät tilat lähteestä, "myDIV" ei sisällä #text-solmua:

<div id="myDIV"><p>Ensimmäinen lapsi</p><p>Viimeinen lapsi</p></div>
<script>
let text = document.getElementById("myDIV").lastChild.nodeName;
</script>

Kokeile itse

Syntaksi

element.lastChild

tai

node.lastChild

Palautusarvo

Tyyppi Kuvaus
Solmu Solmun viimeinen lapsisolmu.
null Jos ei ole lapsia.

Selaimen tuki

element.lastChild Se on DOM Level 1 (1998) ominaisuus.

Kaikki selaimet tukevat sitä täysin:

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