JavaScript/DOM/Node/firstChild
Aus SELFHTML-Wiki
< JavaScript | DOM | Node
Die Eigenschaft Node.firstChild speichert das Objekt des ersten Kindknotens eines Knotens.
Syntax
var childNode = node.firstChild;
Anwendungsbeispiel
Beispiel
ansehen …
<ul><li>erster Punkt</li><li>zweiter Punkt</li></ul>
<p>1.Kindknoten des ersten ul: <span id="ausgabe"></span></p>
Das Beispiel enthält eine Aufzählungsliste mit zwei Listenpunkten.
function init() {
var ersterPunkt = document.getElementsByTagName('ul')[0].firstChild,
ausgabe = ersterPunkt.firstChild.data;
document.getElementById('ausgabe').textContent = ausgabe;
}
Unterhalb davon ist ein JavaScript-Bereich notiert. Dort wird mit
document.getElementsByTagName('ul')[0]
auf das erste ul-Element im Dokument zugegriffen. Mit firstChild
wird dessen erster Kindknoten angesprochen. Im Beispiel ist dies das erste li-Element. In der Variablen ersterPunkt
ist also anschließend das Knotenobjekt des ersten li-Elements gespeichert, aber nicht sein Textinhalt. Dieser wird jedoch anschließend ausgegeben. Da der Textinhalt aus Sicht des li-Elementknotens wieder einen Unterknoten darstellt, kann mit ersterPunkt.firstChild.data
auf den Text des ersten Listenpunktes zugegriffen werden.
Beachten Sie: Gemäß dem DOM stellt bereits ein Zeilenumbruch oder ein Leerzeichen im Quelltext zwischen Elementknoten (so genannnter Whitespace) einen eigenen Text-Kindknoten dar. Auch HTML-Kommentare sind eigene Knoten. Daran halten sich alle gängigen Browser.
Weblinks
- W3C: firstChild
- MDN: Node.firstChild