HTML DOM Özellikleri ve Metotları

Yeni Üyelik

Haber bülteni üyeliği

Ziyaret Bilgileri


[ Per, 21 Kas 2024 ] Toplam 6 ziyaret 6 benzersiz ziyaretçi

htmldom » HTML DOM Özellikleri ve Metotları

HTML DOM Özellikleri ve Metotları

DOM HTML?i bir düğüm objeleri seti olarak modeller. Düğümlere JavaScript ya da diğer yazılım dilleri ile erişilir. Biz bu derslerde JavaScript örnekleri vereceğiz. DOM?un yazılım ara yüzü standart özellikler ve metotlar ile tanımlanır. Burada özelliklerden kastımız bir nesnenin kendisi ya da içeriğidir. Metotlardan kastımız ise yapılmış bir eylemdir.

HTML DOM Özellikleri

Bazı tipik DOM özellikleri şunlardır;

x.innerHTML = x?in (bir html elemanı) içindeki metin değeri
x.nodeName = x?in düğüm ismi
x.nodeValue = x?in değeri
x.patentNode = x?in ebeveyn düğümü
x.childnNodes = x?in çocuk düğümleri
x.attributes = x?in nitelik düğümleri

HTML DOM Yöntemleri

Bazı tipik DOM yöntemleri aşağıdaki gibidir;

x.getElementById(id) = kimliğine (id) göre bir elemanın alınması
x.getElementByTagName(name) = Tanımlanan etiket (tag) ismine sahip tüm elemanları alır
x.appendChild(node) = x?e bir çocuk düğüm ekler
x.removeChild(node) = x?ten bir çocuk düğüm alır

innerHTML

Bir elemanın içeriğinin değiştirilmesinin en kolay yolu innerHTML?dir. innerHTML özelliği w3c tarafından belirlenen bir standart olmamakla beraber majör tarayıcıların tümü tarafından desteklenmektedir.

innerHTML özelliği HTML elemanlarının içeriğini almak ve değiştirmek için kullanılır.

Dizin

Aşağıdaki örnekte kimliği (id) ?giris? olan bir paragraf <p> içeriğinin JavaScript kodu ile alınmasını inceleyeceğiz;

metin = document.getElementById("giris").innerHTML

Açıklaması;

document = HTML dosyası
getElementById("giris") = giris kimlikli (id) <p> elemanı
innerHTML = HTML elemanının iç metini

Örnek

<html>

<body>

<p id="giris">Naber Dunya!</p>

<p id="gelisme">Bu bir HTML DOM ornegidir.</p>

txt=document.getElementById("giris").innerHTML;

txt2=document.getElementById("gelisme").innerHTML;

document.write("Bu metini javaScript yazdiriyor: "+txt);

document.write("<br />Bu metini javaScript yazdiriyor: "+txt2);

</script>

</body>

</html>

childNodes ve nodeValue

innerHTML özelliği ile yaptığınız işi w3c standartlarına göre yapmak isterseniz kullanmanız gereken javaScript kodu aşağıdaki gibidir;

Dizin

metin = document.getElementById("giris").childNodes[0].nodeValue

Açıklaması

document = HTML dosyası
getElementById("giris") = giris kimlikli (id) <p> elemanı
childNodes[0] = <p> elemanının ilk çocuğu (metin elemanı)
nodeValue = düğümün değeri (metinin kendisi)

Örnek

<html>

<body>

<p id="giris">Naber Dunya!</p>

<p id="gelisme">Bu bir HTML DOM ornegidir.</p>

txt=document.getElementById("giris").childNodes[0].nodeValue;

txt2=document.getElementById("gelisme").childNodes[0].nodeValue;

document.write("Bu metini javaScript yazdiriyor: "+txt);

document.write("<br />Bu metini javaScript yazdiriyor: "+txt2);

</script>

</body>

</html>

Yorumlar (2)

Çok yardımcı oldu..Güzel bir site.. Teşekkürler..

Zeynep deniz tarafından | Cmt, 08 Nis 2017 17:37:08 tarihinde yazıldı.

Çok yardımcı oldu..Güzel bir site.. Teşekkürler..

Zeynep deniz tarafından | Cmt, 08 Nis 2017 17:37:07 tarihinde yazıldı.

Editör Bilgileri

Mehmet Emrah Konya

Zibidi

Editöre Ulaşın

En Son Eklenenler


x-isini-pulsari yaz-ucgeni yerel-kabarcik yildizlar-arasi-yolculuk zhai-zhigang avusturya-uzay-ajansi birlesik-krallik-uzay-ajansi