Mitgliederversammlung 2018


Die diesjährige Mitgliederversammlung des Vereins SELFHTML e.V. findet am 8.9.2018 um 10:00 Uhr in Dortmund statt.

Die Adresse des Tagungsortes sowie die geplante Tagesordnung entnehmt ihr bitte der Seite https://forum.selfhtml.org/events/3.

Interessierte Gäste sind gern gesehen.

JavaScript/DOM/Node/previousSibling

Aus SELFHTML-Wiki
< JavaScript‎ | DOM‎ | Node
Wechseln zu: Navigation, Suche

Die Eigenschaft Node.previousSibling speichert aus Sicht eines Knotens den unmittelbar vorhergehenden Knoten im Strukturbaum.

  • DOM 1.0
  • JavaScript 1.5
  • Chrome
  • Firefox
  • IE
  • Opera
  • Safari
  • Nur Lesen / Read Only

Syntax

vorhergehenderKnoten = node.previousSibling;

  • vorhergehenderKnoten: Datenknoten, der entsprechend der childNodes-Liste des Elternelements dem gegebenen Datenknoten direkt vorangestellt ist. Falls der übergebene Knoten bereits der erste in dieser Liste ist, wird null zurückgegeben.

Anwendungsbeispiel[Bearbeiten]

Beispiel ansehen …
<ol><li id="nr1">Schäufele</li><li id="nr2">Schnitzel mit Pommes</li><li id="nr3">Spaghetti</li></ol>
Das Beispiel enthält eine sortierte Liste ol, deren Kindelemente ohne Leerzeichen direkt hintereinander notiert sind.
  function auswerten() { 
    var geschwister = document.getElementById('nr2').previousSibling.innerHTML; 
    var text = 'vorhergehendes Knoten: <span>' + geschwister + '</span>';
    document.getElementById('ausgabe').innerHTML = text;
  }
Durch einen Klick auf den Button wird mit document.getElementById('nr2') auf das zweite Listenlement zugegriffen und mit previousSibling der vohergehende Geschwisterknoten ermittelt. Mit innerHTML wird der Inhalt ermittelt und in der Variablen text, die noch um eine Beschreibung und ein span-Element erweitert wird, gespeichert. Dies wird dann ausgegeben.
Beachten Sie, dass der li-Tag gleich nach dem schließenden li-Tag steht. Da Leerzeichen und Zeilenumbrüche (Whitespace) einen eigenen Knoten (mit der Ausgabe #text) bilden, würde dieses Beispiel in einem mit Einrückungen versehenen HTML-Dokument nicht funktionieren. Wenn die Elemente dynamisch erzeugt werden, spielt dies natürlich keine Rolle.

Weblinks[Bearbeiten]