Vlastnost HTML DOM firstChild
Příklad
Získejte obsah HTML prvního podřízeného uzlu prvku <ul>:
var x = document.getElementById("myList").firstChild.innerHTML;
Další příklady „Vyzkoušejte si to sami“ níže.
Definice a použití
Vlastnost firstChild vrací první podřízený uzel zadaného uzlu jako objekt Node.
Rozdíl mezi touto vlastností a firstElementChild je ten, že firstChild vrátí první podřízený uzel jako uzel prvku, textový uzel nebo uzel komentáře (podle toho, který je první), zatímco firstElementChild vrátí první podřízený uzel jako uzel prvku (ignoruje text a uzly komentářů).
Poznámka: Mezery uvnitř prvků jsou považovány za text a text je považován za uzly (viz "Další příklady").
Tato vlastnost je pouze pro čtení.
Tip: Použijte vlastnost element .childNodes k vrácení libovolného podřízeného uzlu zadaného uzlu. childNodes[0] vytvoří stejný výsledek jako firstChild.
Tip: Chcete-li vrátit poslední podřízený uzel zadaného uzlu, použijte vlastnost lastChild .
Podpora prohlížeče
Property | |||||
---|---|---|---|---|---|
firstChild | Yes | Yes | Yes | Yes | Yes |
Syntax
node.firstChild
Technické údaje
Návratová hodnota: | Objekt Node, který představuje prvního potomka uzlu, nebo má hodnotu null , pokud neexistují žádné dceřiné uzly |
---|---|
Verze DOM | Základní objekt uzlu úrovně 1 |
Další příklady
Příklad
V tomto příkladu si ukážeme, jak mohou bílé znaky narušovat tuto vlastnost.
Získejte název uzlu prvního podřízeného uzlu prvku <div>:
<!--
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>
Příklad
Pokud však ze zdroje odstraníme mezery, v <div> nebudou žádné #textové uzly, což udělá z prvku <p> první podřízený uzel:
<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>
Příklad
Získejte text prvního podřízeného uzlu prvku <select>:
var x = document.getElementById("mySelect").firstChild.text;
Související stránky
HTML DOM reference: uzel. Vlastnost lastChild
HTML DOM reference: uzel. Vlastnost childNodes
HTML DOM reference: uzel. Vlastnost parentNode
HTML DOM reference: uzel. další Nemovitost sourozence
HTML DOM reference: uzel. předchozí Vlastnost sourozence
HTML DOM reference: uzel. Vlastnost nodeName