jQuery Söz Dizim Kuralları | jQuery Syntax

0 109

jQuery kütüphanesinin çalışma mantığı ‘find and do’ yani bul ve yap sözü ile açıklanabilir.Bu mantıktan yola çıkarak jQuery’nin amacı HTML elementlerini seçip bir olay gerçekleştirmekten ibarettir.

jQuery Söz Dizim

Çalışma mantığından yola çıkarak genel bir jQuery söz dizimi:

Dolar işareti ($) burada jQuery’i ifade etmektedir.Seçici kısmında HTML elementleri seçmek için seçiciler gelir.Yani burası find(bul) kısmıdır.İşlem kısmı da  bu şeçilen elemente yapılacak işlemleri göstermektedir.Yani do(yap) kısmı.

Not : Seçici kısmında yani HTML elementlerini seçmek için jQuery, CSS ile hemen hemen aynı seçicileri kullanılır.Bu yüzden CSS seçicilerini iyi bilmeniz yararınıza olur.

Not : Dolar işareti ($) PHP de değişkenleri (value) tanımlamak için kullanılır.jQuery de, parantez () içerisindeki ifadenin jQuery kodları olduğunu tanımlamaya yarar.Bu iki farklı şeyi karıştırmayalım.

Örnek jQuery Kodları:

Document Ready

jQuery kodları genelde HTML elementleri ile birlikte kullanıldığından belge (HTML sayfası) tamamen yüklenmeden çalışması, jQuery kodların doğru çalışmamasına sebep olacağından hata ile karşılaşabiliriz.

Bu sebeple jQuery kodlarının belge yüklendikten sonra çalışmasını sağlamak için document ready olayı kullanılır.Bu yöntem HTML belgesinin yüklenmesini izler ve yüklenme işlemi tamamlandıktan sonra jQuery kodlarını çalıştırır.

Mantığını tamamen anlamak için bir örnekle açıklayalım.Sayfamız da .resim adında bir elementimiz var ve içerisine resim yüklenecek.jQuery kodlarında da bu resmi seçip tıklamayla bir olay gerçekleştireceğiz.Sayfaya eklediğimiz resmin boyutunun büyük olduğunu düşünelim.Bu sebeple sayfa da yüklenmesi uzun sürebilir.Ve aynı anda jQuery kodları çalışmaya başlar.Ama resmimiz yüklenmediğinde jQuery resmizi bulamaz işlemleri gerçekleştiremez.

Document ready bu olayın önüne geçemek için gereklidir.

Document Ready kullanımın farklı şekilleri
jQuery geliştiricileri yukarıda verdiğimiz yöntemi daha az kod ile gerçekleştirmek için bazı yöntemler geliştirmişlerdir.Bunlar şu şekilde:

Not : jQuery kodlarını head elementinin içerisine değil de body bitiş etiketinden hemen önce eklerseniz document ready olayına ihtiyacınız olmaz.Ama bazen bu yöntem de sıkıntı oluşacağından her zaman kullanmanız da yarar var.

Not : Document ready mantığını anladığınıza göre şunu da diyebiliriz.Eğer jQuery kodları HTML belgesinin yüklenmesine ihtiyaç duymuyorsa o zaman kullanmanıza gerek yoktur.

Son olarak:

Bu dersimiz de jQuery syntax yani söz dizim konusuna göz attık.jQuery kodlarının nasıl yazılacağı üzerine durduk ve örnekler ışığında gösterdik.Ayrıca document ready olayına da açıklama getirip, örnek vererek anlatmaya çalıştık.Bu dersimiz de değindiğimiz jQuery seçiciler kısmına bir sonra ki derste detaylı olarak bakacağız.

BİZE KATILIN - KOLAY ERİŞİM
BİZE KATILIN - KOLAY ERİŞİM
İçeriklere ve web tasarım dünyasındaki gelişmelere kolay erişmek için bültene abone olmayı unutmayın
İstediğiniz zaman abonelikten çıkabilirsiniz.
Bunları da beğenebilirsin