JavaScript/DOM/ParentNode/lastElementChild

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Die Eigenschaft lastElementChild enthält eine Referenz auf den letzten Kindknoten eines DOM Knotens, der ein Element ist. Sie kann auf allen DOM-Objekten verwendet werden, die die Schnittstelle ParentNode implementieren (d.h. die Objekte mit den Schnittstellen Document, DocumentFragment und Element).

Das lastElementChild ist nur selten mit dem lastChild identisch, da sich bei lesbar geschriebenem HTML zwischen dem Ende-Tag des Kindelements und dem Ende-Tag des Elements, in dem es enthalten ist, zumeist noch Leerraum befindet, der bereits einen Textknoten darstellt.

Syntax

ParentNode.lastElementChild


Anwendungsbeispiel

Soll der letzte Kindknoten eines Elementes referenziert werden, bei dem es sich um ein Element handelt, dann kann dies unter Verwendung der Eigenschaft lastElementChild bewerkstelligt werden. Ihr Wert ist immer das letzte Kindelement des Objektes über das sie angesprochen wird, oder null, wenn dieses Objekt über keine Kindknoten vom Typ Element verfügt.

Beispiel
<body>
  <main>
    <p>Das Element <code>SCRIPT</code> ist das letzte Kindelement von <code>BODY</code>.</p>
  </main>
  <script>
const lastElement = document.body.lastElementChild;
console.log(lastElement.nodeName);   // SCRIPT
console.log(lastElement.tagName);    // SCRIPT
  </script>
</body>

Im gezeigten HTML Beispielfragment enthält das <body>-Element zwei Kindelemente: <main> und <script>.

Im Script wird zunächst über die gleichnamige Eigenschaft des Dokumentobjektes auf das body-Element zugegriffen. Auf diesem Objekt wird dann die Eigenschaft lastElementChild gelesen, wodurch man eine Referenz auf das <script>-Element erhält. Diese Referenz wird als Konstante lastElement gespeichert. Darüber wird dann die nodeName Eigenschaft gelesen und ausgegeben.

Da es sich um einen Elementknoten in einem HTML Dokument handelt, kann an Stelle des nodeName genauso gut der tagName verwendet werden, wie die dritte Scriptzeile zeigt.

Weblinks