Merhaba. Yine bir makale ile daha sizinleyiz. Bu makalemizde sizlere şu anda revaçta olan bir konudan bahsedeceğiz.

Artık bir çok deneyimli web programcısı Client-Side tarafında DOM(Document Object Model) işlemlerini daha kolay yönetebilmek için birtakım javascript kütüphanelerinden yararlanıyor.

Bunların başını çeken kütüphanelerden biri Jquery olmasının yanı sıra, Mootools, Prototype, Script.calous, Extjs, Yahoo UI gibi kullanışlı ve revaçta olan javascript kütüphaneleri de mevcut.

Bu javascript kütüphaneleri kullanıcıya varsayılan javascript komutlarını uzun uzun yazmaktan kurtarıyor ve yönetilebilirliği artırıyor.

Basit bir şekilde örneklemek gerekirse eğer, "div1" id'sine sahip bir html tagını javascript tarafından çekmek istediğimizde yazmamız gereken komut;

document.getElementById("div1");

olacaktır. Bu işlem Jquery tarafından biraz daha basite indirgenmiş. Arka tarafta çalışan komut aynı olmasın rağmen sizi kod karmaşasından kurtarıyor ve basit bir şekilde işinizi halletmenizi sağlıyor. Jquery tarafındaki komutumuz ise;

$("div1");

olacaktır. Bu 2 komut da dediğimiz gibi aynı işlemi yapıyor. Birçok javascript kütüphanesi sorgulamalarında hemen hemen aynı düzeni kullanıyor. Nesneleri almak için yazdığınız string ifade biçimleri "selector" yani seçici olarak adlandırılıyor.

Şimdi karmaşık bir örnek daha verelim. Web sayfanızda 50 adet "abc" css class'ına sahip link var ve bu linklerin hepsinin farklı bir sayfada açılmasını istiyorsunuz. Bu işlemi normal javascript kodları ile yaptığınızda yazdığınız kod ve yaptığınız iş yükünüz artacak. Tek tek sayfadaki linklerin "abc" class'ına sahip olup olmadığını kontrol eden bir for döngüsü yazmanız gerekecek.

Bu işlemi yapan javascript kütüphaneleri varken neden bu kodu tekrar yazasınız? (Yerine göre farklılık gösterebilen bir cümledir :))

Bu işlemi Jquery javascript kütüphanesinde nasıl yapacağımız sorusuna yanıtımız aşağıdaki kod cümleciği olacaktır.

$("a[class=abc]").attr("target","_blank");("div1");

Görüldüğü gibi işlem çok basit.

Bu javascript kütüphanelerini web sayfanız da kullanmanız için yapmanız gereken gerekli js dosyasını web klasörünüze eklemek ve sonrasında ise gerekli script kodunuz sayfanızın head-head tagları arasına yazmak.

Bu kütüphaneler hakkında daha detaylı bilgiyi;

http://jquery.com/
http://mootools.net/
http://www.extjs.com/
http://developer.yahoo.com/yui/

sitelerinden edinebilirsiniz.

Yeri geldikçe Jquery hakkında küçük makaleler ve performans ipuçları olacak ;)

Hepinize JS Frameworklü günler...

Selametle...