HTML DOM firstChild Özelliği
Örnek
Bir <ul> öğesinin ilk alt düğümünün HTML içeriğini alın:
var x = document.getElementById("myList").firstChild.innerHTML;
Aşağıda daha fazla "Kendiniz Deneyin" örnekleri.
Tanım ve Kullanım
firstChild özelliği, belirtilen düğümün ilk alt düğümünü bir Node nesnesi olarak döndürür.
Bu özellik ile firstElementChild arasındaki fark , firstChild'in ilk alt düğümü bir öğe düğümü, bir metin düğümü veya bir yorum düğümü (hangisi ilk olduğuna bağlı olarak) olarak döndürmesi, firstElementChild ise ilk alt düğümü bir öğe düğümü olarak döndürmesidir (metni yok sayar) ve yorum düğümleri).
Not: Öğelerin içindeki boşluk metin olarak kabul edilir ve metin düğüm olarak kabul edilir (Bkz. "Diğer Örnekler").
Bu özellik salt okunurdur.
İpucu: Belirtilen bir düğümün herhangi bir alt düğümünü döndürmek için element .childNodes özelliğini kullanın. childNodes[0], firstChild ile aynı sonucu üretecektir.
İpucu: Belirtilen bir düğümün son alt düğümünü döndürmek için lastChild özelliğini kullanın.
Tarayıcı Desteği
| Property | |||||
|---|---|---|---|---|---|
| firstChild | Yes | Yes | Yes | Yes | Yes |
Sözdizimi
node.firstChild
Teknik detaylar
| Geri dönüş değeri: | Bir düğümün ilk alt öğesini temsil eden bir Düğüm nesnesi veya alt düğüm yoksa null |
|---|---|
| DOM Sürümü | Çekirdek Düzey 1 Düğüm Nesnesi |
Daha fazla örnek
Örnek
Bu örnekte, boşlukların bu özelliğe nasıl müdahale edebileceğini gösteriyoruz.
Bir <div> öğesinin ilk alt düğümünün düğüm adını alın:
<!--
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>
Örnek
Ancak, boşlukları kaynaktan kaldırırsak, <div> içinde, <p> öğesini ilk alt düğüm yapacak #text düğümü olmaz:
<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>
Örnek
Bir <select> öğesinin ilk alt düğümünün metnini alın:
var x = document.getElementById("mySelect").firstChild.text;
İlgili Sayfalar
HTML DOM referansı: düğüm. lastChild Mülkiyet
HTML DOM referansı: düğüm. childNodes Özellik
HTML DOM referansı: düğüm. parentNode Özellik
HTML DOM referansı: düğüm. nextSibling Mülkü
HTML DOM referansı: düğüm. öncekiKardeş Mülkü
HTML DOM referansı: düğüm. nodeName Özellik