Dom Teorisi (Document Object Model)

DOM, Javascriptin sayfaları tanımlama ve tarif etme ÅŸeklidir. document.writeln() ne demektir? Siz ne iÅŸe yaradığını ve ne zaman kullanmanız gerektiÄŸini biliyorsunuz, ama neden document.writeln() diye adlandırılmıştır? Halbuki print_into_source() gibi daha çok anlam ifade eden bir deyim e olabilirdi. Bu ve bir çok sorunun cevabı DOM’da (Document Object Model) gizlidir. Daha sonra bu konuyu çacağız.

DOM hakkında konuÅŸmaya baÅŸlamadan önce, object-orientated (nesne-yönlendirilmeli) programlamayı tartışmalıyız. Biliyorum, bu biraz teknik elemanların anlayacağı ÅŸeyler gibi duruyor ama öyle deÄŸil. Object-orientated programlamanın en azından Javascript tarafını çözmek için fazla teknik olmaya gerek yok. Object-orientated programlamanın ardındaki esas fikir, bilginin nesnel terimler halinde saklanmasıdır. ÖrneÄŸin, window bir object’dir (nesne). Daha da açacak olursak: Object’ler objectlerin nasıl davranacaklarını tarif eden özelliklere sahiptirler. Bu özellikler, objectlerden bir “.” (nokta) ile ayrılmıştır. Ne demek istediÄŸimi anladınız deÄŸil mi? Bir örnek:

window.status = “Hey, orada neler oluyor?!”;

Bu browser penceresinin status-bar’ına (pencerenin altındaki gri satır) Hey, orada neler oluyor?! diye yazacaktır. Gördüğünüz gibi “window” burada object oluyor, “status” ise özelliÄŸi. Metnin string’i ( Hey, orada neler oluyor?! ) ise özelliÄŸi tarif ediyor. Özelliklere ilave olarak nesnelerin bir de metodları vardır. Bu metodlar da neyin nesi, bunları öğrenmemiz ÅŸart mı? diyebilirsiniz. Metodlara örnek :

alert(), writeIn() veya open(). Özellikler (properties) gibi metodlar da objectlerden bir “.” (nokta) ile ayrılırlar.

document.writeln(’I know JavaScript!’)

Property (özellik) ve metodlar arasındaki esas fark, metodlar her zaman 2 tane parantez tarafından takip edilirler. Parantezlerin içine ise parametreleri koyarsınız. ÖrneÄŸin alert() parantezlerinin içine alert-boxda çıkmasını istediÄŸiniz yazıları koyarsınız. writeln() metodu parantezi içine yazılan string ise HTMLye yazdırılır. Devam etmeden önce son bir ÅŸey: window herzaman varsayılan object’dir. ÖrneÄŸin window.status yazmayla sadece status yazmak arasında bir fark yoktur. Gerçek programcılar genelde yalnız status yazarlar, ama biz ilerde kaybolmamak için uzun haliyle yazsak daha iyi olur sanırım.

Özetlersek: Åžimdiye kadar object’lerin görünümlerini tarif eden properties (özellikleri) olduÄŸunu öğrendik. Ayrıca biliyoruz ki metodlar bir ÅŸeyin nasıl yapılacağını tarif ederler. Sonra window’un varsayılan object olduÄŸunu öğrendik, istersek window’u kodumuza dahil etmeyebiliriz. Kısa özet için bu kadar yeter. Åžimdi baÅŸka bir ilginç yanına bakalım. Objectlerin özellikleri de object olabilir!.. Bir önceki derste resimlerin dönüşümünü hatırlıyormusunuz? “image1″in kaynağını window.document.image1.src = ‘whatever.gif’ ÅŸeklinde göstermiÅŸtik. Dikkat ederseniz, document gerçekte bir property (özellik) olamaz, çünkü özellikler kendilerini tarif eden bir ÅŸey tarafından takip edilmelidir. Aynısı image1 içinde geçerlidir. Sanırım artık tahmin etmiÅŸsinizdir yukardaki örnekte src’un property (özellik) olduÄŸunu. Gördüğünüz gibi document ve image1 her ikiside nesne içinde nesnedirler. Anladınız sanırım kısa içeriÄŸin uzun tarifi).