Beispiel
Holen Sie sich den HTML - Inhalt des ersten untergeordneten Knoten eines <ul> Element:
var x = document.getElementById("myList").firstChild.innerHTML;Das Ergebnis von x wird sein:
Coffee Versuch es selber " Mehr "Try it Yourself" Sie "Try it Yourself" Beispiele unten.
Definition und Verwendung
Die first Eigenschaft gibt den ersten untergeordneten Knoten des angegebenen Knotens, als Node-Objekt.
Der Unterschied zwischen dieser Eigenschaft und firstElementChild , ist , dass first den ersten untergeordneten Knoten als ein Element Knoten zurückgibt, ein Textknoten oder einen Kommentarknoten (depending on which one's first) , (ignores text and comment nodes) (depending on which one's first) , während firstElementChild den ersten untergeordneten Knoten als ein Element Knoten zurückzugibt (ignores text and comment nodes) .
Hinweis: Leerzeichen innerhalb Elemente werden als Text und Text wird als Knoten betrachtet (See "More Examples") .
Diese Eigenschaft ist schreibgeschützt.
Tipp: Verwenden Sie das Element .childNodes Eigenschaft jedes Kind - Knoten eines bestimmten Knotens zurückzukehren. childnodes [0] wird das gleiche Ergebnis wie first produzieren.
Tipp: Um den letzten Kindknoten eines bestimmten Knotens zurückzukehren, ist die Verwendung lastchild Eigenschaft.
Browser-Unterstützung
| Eigentum | |||||
|---|---|---|---|---|---|
| firstChild | Ja | Ja | Ja | Ja | Ja |
Syntax
node .firstChildTechnische Details
| Rückgabewert: | Ein Knotenobjekt, das erste Kind eines Knotens darstellt, oder null , wenn keine Kinderknoten sind |
|---|---|
| DOM Version | Core Level 1 Knoten Object |
Mehr Beispiele
Beispiel
In diesem Beispiel zeigen wir, wie Leerzeichen mit dieser Eigenschaft interfare kann.
Holen Sie den Knotennamen des ersten Kindes Knoten eines <div> Element:
<!--
Whitespace inside elements is considered as text, and text is
considered as nodes
In this example, there is whitespace before <p>,
before <span> and after <span>
Therefore, the first child
node of <div> is a #text node, and not the <p> element you expected
-->
<div id="myDIV">
<p>Looks
like first child</p>
<span>Looks like last Child</span>
</div>
<script>
var x = document.getElementById( "myDIV" ).firstChild.nodeName;
document.getElementById("demo").innerHTML = x;
</script>Das Ergebnis von x wird sein:
#text Versuch es selber " Beispiel
Wenn wir jedoch die Leerzeichen aus der Quelle zu entfernen, gibt es keine #text Knoten in <div>, die das machen <p> Element das erste Kind - Knoten:
<div id="myDIV"><p>First child</p><span>Last Child</span></div>
<script>
var x = document.getElementById( "myDIV" ).firstChild.nodeName;
document.getElementById("demo").innerHTML = x;
</script>Das Ergebnis von x wird sein:
P Versuch es selber " Beispiel
Holen Sie sich den Text des ersten untergeordneten Knoten eines <select> Element:
var x = document.getElementById("mySelect").firstChild.text;Das Ergebnis von x wird sein:
Audi Versuch es selber " Verwandte Seiten
HTML - DOM - Referenz: Knoten. lastchild Immobilien
HTML - DOM - Referenz: Knoten. Eigenschaft Childnodes
HTML - DOM - Referenz: Knoten. parentNode Immobilien
HTML - DOM - Referenz: Knoten. nextSibling Immobilien
HTML - DOM - Referenz: Knoten. previousSibling Immobilien
HTML - DOM - Referenz: Knoten. nodeName Immobilien