Najnowsze tutoriale tworzenie stron internetowych
 

HTML DOM firstChild Propery

<Element Przedmiot

Przykład

Pobierz zawartość HTML pierwszego węzła potomnego <ul> element:

var x = document.getElementById("myList").firstChild.innerHTML;

Wynikiem X będzie:

Coffee
Spróbuj sam "

Więcej "Try it Yourself" przykłady poniżej.


Definicja i Wykorzystanie

Nieruchomość firstChild zwraca pierwszy węzeł podrzędny określonego węzła, jako obiekt węzła.

Różnica między tym obiekcie i firstElementChild , że firstChild zwraca pierwszy węzeł dziecko jako węzeł elementu, węzła tekstowego lub węzła komentarza (depending on which one's first) , natomiast firstElementChild zwraca pierwszy węzeł dziecko jako węzeł elementu (ignores text and comment nodes) .

Uwaga: białe znaki wewnątrz elementów jest traktowane jako tekstu, a tekst jest uważany jako węzły (See "More Examples") .

Ta właściwość jest tylko do odczytu.

Wskazówka: Użyj .childNodes elementu właściwość, aby powrócić żadnego węzła potomnego określonego węzła. childNodes [0] będzie taki sam wynik jak firstChild.

Wskazówka: Aby powrócić do ostatniego węzła potomnego określonego węzła, użyj lastChild nieruchomości.


Wsparcie przeglądarka

Nieruchomość
firstChild tak tak tak tak tak

Składnia

node .firstChild

Szczegóły techniczne

Zwracana wartość: Obiekt węzeł reprezentujący pierwsze dziecko węzła lub null, jeśli nie ma węzły potomne
DOM Version Rdzeń poziomu obiektu 1 Węzeł

Przykłady

Więcej przykładów

Przykład

W tym przykładzie pokazujemy, w jaki sposób może spacje interfare z tej nieruchomości.

Uzyskaj nazwę węzła pierwszego węzła potomnego <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>

Wynikiem X będzie:

#text
Spróbuj sam "

Przykład

Jeśli jednak usunąć spacje ze źródła, nie ma żadnych węzłów #text w <div>, które sprawiają, że <p> Element pierwszy węzeł dziecko:

<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>

Wynikiem X będzie:

P
Spróbuj sam "

Przykład

Uzyskać tekst pierwszego węzła potomnego <select> element:

var x = document.getElementById("mySelect").firstChild.text;

Wynikiem X będzie:

Audi
Spróbuj sam "

Podobne strony

HTML DOM: węzeł. lastChild nieruchomości

HTML DOM: węzeł. childNodes nieruchomości

HTML DOM: węzeł. parentNode nieruchomości

HTML DOM: węzeł. nextSibling nieruchomości

HTML DOM: węzeł. previousSibling nieruchomości

HTML DOM: węzeł. nodeName nieruchomości


<Element Przedmiot