Website tasarımınızı bitirip, html kodlamalarınızı da yerleştirdiğinizde, web sayfalarınızın her biri javascript açısından birer "document" nesnesidir artık.
Sayfalarınızdaki her bir nesneye "DOM" arayüzü ile müdahale edebilir, istediğiniz değişiklikleri yapabilir, istediğiniz olayları ilgili nesnelere atayabilirsiniz.
DOM yapısını öğrenmek; javascript ve dolaylı olarak jQuery kullanımında olayın mantığını kavramak açısından çok yararlı olacaktır.
DOM ("Document Object Model"), HTML ve XML belgeler ("documents") için "Program Uygulama Arayüzü (API)"dür. Bu uygulama sayesinde HTML ve XML belgeler üzerinde istenilen yerde değişim, ekleme, silme gibi işlemler yapılabilmektedir.
Fig.1'de javascript nesnelerinin birbirleriyle olan ilişkileri gösterilmektedir. En üst nesnemiz "window" nesnesidir. Örnek olarak "window->document->forms->elements[]" yapısı gösterilmiştir."
Fig1. Javascript "nesne (object)" yapısı.
Fig2. DOM, "ebeveyn-çocuk (parent-child)" yapısı.
Fig.2'de DOM yapısının belge üzerindeki "ebeveyn-çocuk (parent-child)" yapısı ("parent", "child", "sibling vb.) gösterilmektedir.
Bu yapıları öğrendiğinizde, website sayfalarınızdaki müdahale etmeniz gereken nesnelere "zincirleme" yöntemiyle ulaşıp, istediğiniz düzenlemeleri yapabilirsiniz.
Görüşmek üzere...
