JavaScript HTML DOM belgesi

HTML DOM doküman nesnesi, web sayfanızdaki diğer tüm nesnelerin sahibidir.

HTML DOM Document nesnesi

Doküman nesnesi, web sayfanızı temsil eder.

HTML sayfasındaki herhangi bir elemente erişmek istiyorsanız, her zaman document nesnesinden başlamanız gerekir.

Aşağıda, document nesnesini kullanarak HTML'e nasıl erişim ve işlem yapılacağına bazı örnekler verilmiştir.

HTML elementini bulma

Yöntem Tanım
document.getElementById(id) Element id'si ile element bulma
document.getElementsByTagName(ad) Etiket adı ile element bulma
document.getElementsByClassName(ad) Sınıf adı ile element bulma

HTML elementini değiştir

Yöntem Tanım
element.innerHTML = yeni html içeriği Elementin iç HTML'ini değiştir
element.attribute = new value HTML elementinin özellik değerini değiştir
element.setAttribute(attribute, value) HTML elementinin özellik değerini değiştir
element.style.property = new style HTML elementinin stilini değiştir

Elementleri ekle ve sil

Yöntem Tanım
document.createElement(element) HTML elementi oluştur
document.removeChild(element) HTML elementini sil
document.appendChild(element) HTML elementi ekle
document.replaceChild(element) HTML elementini değiştir
document.write(text) HTML çıktı akışına yazın

Olay işleyici ekle

Yöntem Tanım
document.getElementById(id).onclick = function(){code} onclick olayına bir olay işleyici ekleyin

HTML nesnesi bulma

İlk HTML DOM Level 1 (1998), 11 adet HTML nesnesi, nesne koleksiyonu ve özelliği tanımladı. HTML5'te hala geçerlidir.

HTML DOM Level 3'te daha fazla nesne, koleksiyon ve özellik eklendi.

Özellikler Tanım DOM
document.anchors name özelliğine sahip tüm <a> elementlerini döndür. 1
document.applets Bütün <applet> elementlerini döndür(HTML5'te kullanılmaz) 1
document.baseURI Belgenin mutlak temel URI'sini döndür 3
document.body <body> elementini döndür 1
document.cookie Belgenin cookie'ını döndür 1
document.doctype Belgenin doctype'ını döndür 3
document.documentElement <html> elementini döndür 3
document.documentMode Tarayıcı tarafından kullanılan modu döndür 3
document.documentURI Belgenin URI'sini döndür 3
document.domain Belge sunucusunun alan adını döndür 1
document.domConfig Kullanılmıyor.DOM ayarlarını döndür 3
document.embeds Bütün <embed> elementlerini döndür 3
document.forms Tüm <form> Elemanlarını döndür 1
document.head <head> Elemanını döndür 3
document.images Tüm <img> Elemanlarını döndür 1
document.implementation DOM Uygulamasını döndür 3
document.inputEncoding Belgenin kodlamasını (karakter kümesi) döndür 3
document.lastModified Belgenin güncellenen tarih ve zamanını döndür 3
document.links Tüm <area> ve <a> Elemanlarının href Özniteliğine sahip olanlarını döndür 1
document.readyState Belgenin (yüklenen) durumu döndür 3
document.referrer Alınan URI'yi (bağlantılı belge) döndür 1
document.scripts Tüm <script> Elemanlarını döndür 3
document.strictErrorChecking Hata denetimi zorunlu olup olmadığını döndür 3
document.title <title> Elemanını döndür 1
document.URL Belgenin tam URL'ini döndür 1