HTML DOM Nedir?

HTML DOM’un tam olarak açılımı “Document Object Model” demektir. Türkçe karşılığı “Belge Nesnesi Modeli” demektir. DOM, HTML, XML gibi belgelerin diğer programlama dilleri veya script dilleriyle iletişim kurabilmesini sağlamak için geliştirilmiş bir arabirimdir.

JS gibi programlama dillerinin Object-Oriented (Nesne Yönelimli) olarak HTML ile iletişim kurması için kullanılan bir yapıdır, kısaca köprü görevi gören bir arayüzdür. Bu yapı sayesinde HTML salt bir metin olmaktan çıkıp erişilebilir bir nesne modeline sahip oluyor. Yani JS kullanarak bir nesnesinin Attribute (olarak anılır ama Property‘de diyebilirsiniz) değerini, örneğin href attribute’ne değer atamak mümkün. Bu noktada JS o tagını bulmak için kullandığı yol HTML DOM’dan geçer.Bütün çarklar nesne yapısı içinde dönüyor.

Tarayıcının server’dan aldığı metin formatındaki HTML içeriğini bu tip nesne yapısına uyarlayarak Client (istemci) tarafında daha yönetilebilir bir ortam oluşturur. Böylece Java script kodlarınızı çalıştırabilir, HTML Element/Nesnelerine erişip dinamik bir arayüz sunabilirsiniz. Bu durum geliştirici açısından da önemlidir, tarayıcınız size DOM öğelerini önizleme ve takip etmenize de olanak sağlar. CTRL + Shift + C(Opera), I (Chrome) ile geliştirici arayüzünde bunu görebiliriz. 

DOM Events

DOM Eventleriyle JS’de kullandığınız click, keydown, keyup, scroll ve birçok eventi içinde barındırır ve cevap verir. Bu sayede butona basıldığında bir fonksiyonun tetiklenmesi, textbox’da entere basınca basılan tuşun enter olup olmadığını kontrol edip işlem yapılması, datetime picker’dan seçilen tarihin istenen şekillerde kullanılması gibi birçok durumu yönetmemizi sağlıyor.