Jquery Selector Kullanımı (Seçiciler)

JQuery için en önemli konulardan birisi seçicilerdir.Seçiciler Dom öğelerine erişmek,dinamik işlemler yapmak,olaylar vermek ve değiştirmek için en çok kullanacağımız özellikdir.Jquery ile “$” kullanarak az kod ile çok işler yapabiliriz.

$("p") --Tüm paragrafları seçmemizi sağlar.
$("div p") --Div içerisinde bulunan paragrafları seçmemizi sağlar.
$("#login") --ID'si login olan nesneyi seçmemizi sağlar.
$(".login") --Class'ı login olan nesneyi seçmemizi sağlar.
$("#login[name]") --ID'si login olan ve isim değeri olan nesneyi seçmemizi sağlar.
$("a[name=salih]") --Name'i salih olan nesneleri seçmemizi sağlar.
$("input[name^=search]") --Name'i search ile başlayan input nesnelerini seçmemizi sağlar.
$(".login[name$=password]") --Class'ı login olan ve ismi "password" ile biten inputları seçmemizi sağlar.
$("a[id!=login]") --ID'si login olmayan nesneleri seçmemizi sağlar.
$("a[id*=salih]") --ID içerisinde "salih" geçen nesneleri seçmemizi sağlar.
$("input[type=hidden]") --Type'i hidden olan input nesnelerini seçmemizi sağlar.

En çok kullanılan seçiciler yukarıdaki gibidir..Ama JQuery seçicilerinin özellikleri bunlarla sınırlı değil.Devam edelim..

$("a:odd") --Seçilen elemanları 0dan başlayarak numaralandırır.Indexi tek olan nesneyi verir.Örneğin 5 tane nesneden 1 ve 3. nesneyi verir.
$("a:even") --Seçilen elemanları 0dan başlayarak numaralandırır.Indexi çift olan nesneyi verir.Örneğin 5 tane nesneden 2 ve 4. nesneyi verir.
$("p:first") --Sıralamada ilk gelen paragrafı seçer.
$("#login p:last") --ID'si login olan nesnenin içerisindeki ilk paragrafı seçer.
$("p:not(:last)") --Son paragraf hariç bütün paragrafları seçer.
$("li:eq(0)”) --Liste sıralamasında sıfır (0) olan liste elemanını seçer
$("li:gt(2)”) --Liste sıralamasında ikiden büyük olan liste elemanını seçer
$("li:lt(2)”) --Liste sıralamasında ikiden küçük olan liste elemanını seçer
$("p:contains('salih')") --İçerisinde "salih" kelimesi geçen elemanları seçer.
$("div:empty") --içerisinde yazı olmayan div nesnelerini seçer
$("div:parent") --içerisinde yazı bulunan div nesnelerini seçer
$("div:has(a)") --içerisinde link bulunan div nesnelerini seçer
$("a:hidden") --gizli linklerin hepsini seçer
$("a:visible") --görünür linklerin hepsini seçer
$(":button:enabled”) --aktif olan bütün butonları seçer
$(":button:disabled”) --pasif olan bütün butonları seçer
$(":checkbox:checked”) --işaretlenmiş olan bütün checkboxları seçer
$("input:text”) --bütün text nesnelerini seçer
$(".giris:button”) --sınıfı giriş olan butonları seçer
$("select option:selected”) --seçim kutusundan seçili olan nesneyi seçer
$("select [value=2]") --seçim kutusundan değeri iki (2) olan nesneyi seçer

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir