Pazar , 28 Mayıs 2017
Anasayfa » JavaScript » Jquery Seçiciler

Jquery Seçiciler

Bütün jquery seçicileri $() şeklinde tanımlanır. Seçicilerin basit kullanımlarını örneklerle açıklayacağım.

Sayfada örnek olarak verilen HTML etiketlerini kullanarak işlemleri seçme  işlemlerini gerçekleştireceğiz.

Tüm örneklerde kullanacağımız HTML etiketi aşağıdadir.

 

Basit Seçiciler

Etiket (tag) adı ile seçmek.

$(“div”)  sayfadaki tüm div etiketlerini seçer.

$(“p”) sayfadaki tüm p etiketlerini seçer.

 

 

Class adı ile seçmek. Css’de olduğu gibi .classAdi şeklide istediğimiz etiketleri seçmemiz mümkün.

$(“.ogrenci”)  class ismi öğrenci olan etiketleri seçer.

$(“.aktif”) class ismi aktif olan etiketleri seçer.

 

Id adı ile seçmek. Css’de olduğu gibi #id adı ile istediğimiz etiketi seçmemiz mümkün.

$(“#logo”)  id adı logo olan etiketi seçer.

$(“dikey-menu”) id adı dikey-menu olan etiketi seçer.

Birden çok etiketi tek bir seçici ile seçmek mümkün. Birden fazla seçme işlemi yapılacak etiketler ,(virgül) karakteri ile tek seçici içine eklenebilir.

$(“#logo,a,p”) id adı logo , a etiketi ve p etiketlerini seçilmektedir.

$(“h1,h2,h3”) h1,h2 ve h3 etiketlerini seçmektedir.

Hiyerarşi Seçiciler

Css yapısındaki gibi alt alta etiket gruplarını seçebiliriz.

Yukarıdaki HTML örneğini kullanarak. Aşağıdaki seçme işlemlerini gerçekleştirebiliriz.

ul etiketi içindeki li etiketlerini seç:(torun seçme yöntemi)

li etiketinin ilk altındaki a etiketi etiketlerini seç:(çocuk seçme yöntemi)

 

Attribute seçiciler

Css   attribute seçme yönteminin aynısını jquery ile de kullanabiliriz.

Çocuk Seçiciler(Child Selector)

Bir html yapısı içinde bazen bir etiketi, bazende belirli bir sırada etiketi seçmek isteriz. Cssde olduğu gibi sözde  sınıf (pseude class) seçme yöntemiyle html etiketlerini seçebiliriz.

Aynı etiket grubu içindeki ilk etiketi seçer.

ilk li etiketini seçme:

yada

Aynı şekilde son çocuğu seçmekte mümlün.

 

yada

Nth-Child ile belirli bir düzene göre de seçim yapmak mümkün.

Örn: 2. li etiketi seçmek için

Örn:3.li etiketi içindeki a etiketini seçmek için

çift olan li etiketleri seçmek için.

 

İçerik filitreleyerek seçim yapma;

İçerisindeki geçen kelimelere göre filtrelemek için. Bazen içersindeki kelimelerin altını çizme yada içindeki geçen gelimeye göre etiket ile işlem yapmak isteyebiliriz. Jqueryde bunun için yazılmış bir seçici var.Etiket adından sonra : ile contains bildiriminin içine aranacak ifade yazılır.

İçinde Galeri geçen a etiketlerini seçer:

 

 

 

Hakkında Hayri

İlginizi Çekebilir

JQuery UI Tabs Menü Kullanımı

Bu örneğimizde JQuery’nin Ui eklentisini kullanarak Tabs Menü yapacağız. İlk olarak JQuery’nin sayfasından, JQuery ve …

Bir Cevap Yazın

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