JQuery ve Sanat

Tekrar merhaba,
Bu yazımda JQuery ile sanat nasıl yapılır konusuna ışık tutmaya çalışacağım. Sanat yapmak derken belki biraz abartmış olabilirim ama abartı çoğu insanın ilgilini çeken bir olgudur. Klasik, nedir - ne değildir zamazingosunu yapalım. Öncelikle resmi sitesini vererek kaynak belirtebiliriz - http://jquery.com/
not: indirirken size 2 seçenek sunmaktadır. Production / development şeklinde. Farkı, ilkinde gereksiz boşluk ve satır atlama karakterleri silinerek dosyanın boyutu küçültülmüş, bir nevi sıkıştırma yapılmış. Fakat kodun okunması neredeyse imkansız çünkü herşey birbirine geçmiş durumda. İkinci seçenekte ise kodlar okunaklı bir şekilde yayınlanıyor. Boyutu ilkine göre daha fazla ama bir geliştirici için çok değerli.
JQuery kütüphane içerisindeki kopyalama hakkı yazısını değiştirmediğiniz sürece ticari uygulamalarda dahi kullanabilirsiniz. Tamamen ücretsiz. Lisans detayları için resmi sitesinden bilgi alabilirsiniz.

Bu aralar çok duymaya başladım, nedir bu JQuery?
Özetle javascript yazımını kolaylaştıran kütüphane. İçerisinde bir çok javascript fonksiyonu barındırıyor. En önemli özelliği tarayıcı bağımsız olması. Yani JQuery ile yazdığımız javascript komutları tüm tarayıcılarda aynı şekilde sorunsuz olarak çalışmaktadır. Web ortamında javascript geliştirenler tarayıcı uyumsuzluğu sorununu bilmektedir. JQuery ile bu ortadan kalkmaktadır. Pratikte JQuery bize yeni birşey değil. Normal javascript komutlarıyla yapacaklarımızdan ötesi yok. O bize hızlı, güvenilir ve tarayıcı bağımsız javascript geliştirme imkanı sunmaktadır.

Hızlı bir giriş

 $(document).ready(function(){
   $("a").click(function(event){
     alert("Tum linkler bu yaziyi gosterir!");
   });
 });

Sırayla inceleyelim. Öncelikle $ karakterinden başlamak istiyorum. Bu fark edebileceğiniz gibi bir fonksiyon aslında. Bildiğimiz javascript fonksiyonu. JQuery için temel ifade ediyor. Tüm çağrılarımızı bu fonksiyon üzerinden yapıyoruz. Reguler Expression tanımlamalarını çok iyi kullandıkları için bu fonksiyonun içerisine verebileceğimiz parametrelerin sayısı oldukça fazla. $(document) ile javascript'in çalıştığı dosyayı seçiyoruz. Daha sonra gelen .ready(... ifadesiyle sayfamızın işlem için hazır olduğunu garantiliyoruz.
function() { } neden gerekli?
.ready olayında çalışmasını istediğimiz kodları direk parantez içerisinde yazsaydık kodumuz çalışmayacaktı. Çünkü JQuery çalışma mantığında bir iş yapmak için o işi yapacak fonksiyonun adını ilgili JQuery fonksiyonuna vermeliyiz. Aynı fonksiyon işaretçileri gibi ya da diğer bir benzetmeyle klasik setTimeout javascript komutunda olduğu gibi.
Şimdi biraz toparlayalım:
$(document) // sayfamız
.ready( // hazır olunca çalıştır
function() { ... } // yeni bir fonksiyon ürettik ve bağladık
);

İyi gidiyoruz, ya sonra?
Yeni oluşturduğumuz fonksiyonun içeriğini inceleyelim.
$("a") // a taglı elemanları seç.
.click( // tıklayınca çalıştır.
function() { ... } // yeni bir fonksiyon ürettik ve bağladık
);
Burada oluşturduğumuz fonksiyonun içerisine alert komutumuzu yerleştirdik.
Kodumuzu çalıştırdığımızda sayfamızdaki tüm linkler tıklandığında bu mesajı alacaklar.
Giriş olarak bu kadarla yetineceğim. Daha sonraki yazılarımda detaylı incelemeler ve yeni örnekler sunacağım.
Görüşmek üzere...