HTML DOM Nedir?

DOM Nedir?

Document Object Model(Doküman Nesne Modeli)’in kısaltması olan DOM dokümanlara erişmek için olan bir W3C standardıdır.
DOM dokümandaki nesnelere erişmek ve içeriğini, stilini, yapısını değiştirmek için kullanılır.

DOM Yapısı

DOM Yapısını bir ağaç olarak düşünebilirsiniz. En tepede yani kökte HTML etiketi, onun altında ise içerisine yazılmış diğer etiketler bulunur. 

Örnek olarak; 

<html>
<head>
    <title></title>
    <style></style>
</head>
<body>
   <div>
      <p>Dijiton Bilişim Teknolojileri</p>
   </div>
</body>
</html>

Yukarıda gördüğünüz HTML yapısı şu şekildedir:

HTML DOM Nedir?

HTML için kullanılan doküman nesne modelidir. HTML Elementlerini objeler olarak, HTML elementlerinin tüm özelliklerini, HTML elementlerine erişmek için metotları, tüm HTML elementleri için olayları tanımlar. Diğer bir deyişle HTML DOM yeni elementler eklemek, elementleri değiştirmek veya silmek için kullanılır.

HTML DOM Metotları

HTML DOM metotları elementler üzerinde uygulayabileceğiniz eylemlerdir.
HTML DOM özellikleri ise elementlerin değiştirebileceğiniz veya ayarlayabileceğiniz değerleridir.

HTML DOM’a JavaScript ile erişim sağlayabilirsiniz. Örnek olarak aşağıdaki kod bloklarında p elementinin içerisindeki metni değiştirdik.

<html>
<body>

<p id=”metin”>DijitonBilişimTeknolojileri</p>

<script>
document.getElementById(“metin”).innerHTML = “Değiştirilmiş Metin!”;
</script>

</body>
</html>Bu örnekte document. getElementById bir metod, innerHTML ise bir özelliktir. HTML elemanlarına erişmek için en çok kullanılan yol getElementById metodudur. Bu metot ile dokümanın içinde verdiğimiz id’ye sahip elementi bulup üzerinde işlem yapabiliriz