jQuery Seçicileri
- Önceki sayfa jQuery Grameri
- Son sayfa jQuery Olayları
Seçiciler, element grupları veya tek bir element üzerinde işlem yapmanızı sağlar.
jQuery Seçicileri
Önceki bölümlerde, HTML elementlerini nasıl seçeceğinizle ilgili bazı örnekler gösterdik.
Anahtar nokta, jQuery seçicilerin nasıl doğru şekilde istediğiniz etkiyi uygulayacağınız elementleri seçtiğini öğrenmek.
jQuery element seçicileri ve özellik seçicileri, etiket adı, özellik adı veya içeriğe göre HTML elementlerini seçmenizi sağlar.
Seçiciler, HTML element grupları veya tek bir elemente işlem yapmanızı sağlar.
HTML DOM terimlerinde:
Seçiciler, DOM element grupları veya tek bir DOM düğümüne işlem yapmanızı sağlar.
jQuery Element Seçicileri
jQuery, HTML elementlerini seçmek için CSS seçicilerini kullanır.
$("p") <p> elementlerini seçer.
$("p.intro"), class="intro" olan tüm <p> elementlerini seçer.
$("p#demo"), id="demo" olan tüm <p> elementlerini seçer.
jQuery Özellik Seçicileri
jQuery, belirli bir özelliğe sahip elementleri seçmek için XPath ifadeleri kullanır.
$("[href]") href özelliği olan tüm elementleri seçer.
$("[href='#']"), href değerleri "#" ile eşit olan tüm elementleri seçer.
$("[href!='#']"), href değerleri "#" ile eşit olmayan tüm elementleri seçer.
$("[href$='.jpg']"), ".jpg" ile biten href değerine sahip tüm elementleri seçer.
jQuery CSS Seçicileri
jQuery CSS seçicileri, HTML elementlerinin CSS özelliklerini değiştirmek için kullanılır.
Aşağıdaki örnek, tüm p elementlerinin arka plan rengini kırmızıya değiştirir:
Örnek
$("p").css("background-color","red");
Daha fazla seçici örnek
| Sözdizimi | Açıklama |
|---|---|
| $(this) | Güncel HTML elementi |
| $("p") | Tüm <p> elementleri |
| $("p.intro") | Tüm class="intro" olan <p> elementleri |
| $(".intro") | Tüm class="intro" olan elementler |
| $("#intro") | id="intro" olan element |
| $("ul li:first") | Her <ul> elementinin ilk <li> elementi |
| $("[href$='.jpg']") | Tüm özellik değeri sonunda ".jpg" ile biten href özellikleri |
| $("div#intro .head") | id="intro" olan <div> elementindeki tüm class="head" elementleri |
Tam referans kılavuzuna ulaşmak için lütfen bizim jQuery Seçici Referans Kılavuzu。
- Önceki sayfa jQuery Grameri
- Son sayfa jQuery Olayları
