Sizzle.js İle Jquery Seçicisini Kullanma

Eğer jquery seçicisi hoşunuza gittiyse jquery ekibinin sadece seçici kütüphanesi olarak hazırladığı ve dağıttığı Sizzle adlı kütüphane ile javascript geliştirmeleriniz için büyük kolaylık saplayabilir. Makalenin devamnda sizzle ile detaylı bilgiye ulaşabilirsiniz.

Sizzle.js ile jquery seçicisini kullanma

Web projelerinizde sürekli javascript’in document.getElementById, getElementByName, getElementsByClassName gibi seçicileri kullanmaktansa jQuery kullandıysanız eğer o seçicileri kullanabilmektesiniz böylelikle document.getElementByClassName('test') yerine $('.test') yazmanız yeterli olacakltır. Şİmdi ise Sizzle.js’nin bazı özelliklerini görelim.

Sizzle.js’nin bazı özellikleri

  • Hiçbir kütüphane ile bağımlılığı yoktur
  • En sık kullanılan seçiciler arasında hızı ile öne geçen bir seçicidir.
  • gzip ve minifield ile sadece 4KB
  • Kolay kullanımlı API ile geliştirilebilir.
  • CSS3 Seçicilerin tümünü desteklemektedir

Sizzle.js’nin bazı kullanım yerleri

  • Has seçicisi ile nesnenin varlığını kontrol etme mesela p etiketi altında table olan p etiketlerini almak isterseniz şu şekilde bir kodlama yapmalısınız…

  • Pozisyon seçicileri kullanmayı alttaki tabloda görebilirsiniz.
Pozisyon pseudo’larıAçıklamaÖrnekÖrnek Açıklama
:firstilk nesneyi seçmeSizzle(tr:first)İlk tr etiketini seçiyoruz
:lastSon nesneyi seçmeSizzle(tr:last)Son tr etiketini seçiyoruz
:oddİndex değeri tek olan nesneleri seçerSizzle(tr:odd)İndex değeri 1-3-5-7… olan tr etiketlerini seçiyoruz
:evenİndex değeri çift olan nesneleri seçerSizzle(tr:even)İndex değeri 0-2-4-6-8… olan tr etiketlerini seçiyoruz
:gtGreater than(daha büyük)’in kısaltılmışıdır ve belirttiğimiz index değerinden büyük olaranları seçerSizzle(tr:gt(4))tr Index değeri 4’den büyük olanları seçiyoruz
:ltLess than(daha küçük)’in kısaltılmışıdır ve belirttiğimiz index değerinden küçük olanları seçerSizzle(tr:lt(4))tr Index değeri 4’den küçük olanları seçiyoruz
:eqEqual(eşite)’in kısaltılmışıdır belirttiğimiz index değerini seçerSizzle(tr:eq(4))Index değeri 4 olan tr etiketini seçer
  • Kolayca form nesnelerini seçebilirsiniz :input, :text, :checkbox, :file, :password, :submit, :image, :reset, :button

Sizzle.js kütüphanesi jQuery’nin kendi içerisinde kullandığı bir seçicidir ve sadece seçicilerini seçicileri çıkatılarak oluşturulmuştur Sizzle.js yani gidipte css(), append(), animate() gibi fonksiyonları kullanmaya kalkmayın çalışmayacaktır bu paket sadece nesne seçim işlemleri için kullanılmaktadır eğer hem jQuery fonksiyonlarını hemde seçicisini kullanmak istiyorum derseniz o zaman jquery.com’dan jquery kütüphanesini kullanmanız gerekecek

Sizzle.js kütüphanesini indirmek için tıklayınız.

Bir Cevap Yazın