analisis penggunaan pemilih penapis jQuery_jquery

Contoh dalam artikel ini menerangkan penggunaan pemilih penapis jQuery. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Dalam amalan, pemilih penapis boleh ditambah pada pemilih asas untuk menyelesaikan tugasan pertanyaan Bergantung pada situasi tertentu, nilai indeks, kandungan, atribut, kedudukan sub-elemen dan bentuk elemen boleh digunakan dalam. pemilih penapis

Atribut domain dan keterlihatan sebagai keadaan penapis

1 :pemilih pertama

Format:

Salin kod Kod adalah seperti berikut:

$("selector: first")

digunakan Tapis koleksi jQuery semasa dan pilih elemen padanan pertama

Contoh:

Salin kod Kod adalah seperti berikut:

$("td:first").css ("sempadan ", "2px biru pepejal");

2 :pemilih terakhir

Format:

Salin kod Kod adalah seperti berikut:

$("selector: last")

digunakan Tapis koleksi jQuery semasa dan pilih elemen padanan terakhir
Contoh:

Salin kod Kod adalah seperti berikut:

$("td:last").css("border "," 2px biru pepejal");

3. :pemilih ganjil

Format:

Salin kod Kod adalah seperti berikut:

$("selector: ganjil")

digunakan Pilih semua elemen dengan indeks ganjil (mengira dari 0)

Contoh:

Salin kod Kod adalah seperti berikut:

$("td:odd").css ("latar belakang ", "merah");

4. :pemilih genap

Format:

Salin kod Kod adalah seperti berikut:

$("selector: even")

digunakan Pilih semua elemen dengan indeks genap (mengira dari 0)

Contoh:

Salin kod Kod adalah seperti berikut:

$("td:even").css ("latar belakang ", "merah");

5. :eq pemilih

Format:

Salin kod Kod adalah seperti berikut:

$("selector:eq(index)" )

Digunakan untuk memilih elemen yang indeksnya sama dengan nilai yang diberikan daripada set yang dipadankan

Contoh:

Salin kod Kod adalah seperti berikut:

$("li:eq(1)" ).css ("warna", "biru");

6. :gt pemilih

Format:

Salin kod Kod adalah seperti berikut:

$("selector:gt(index)" )

Digunakan untuk memilih semua elemen daripada set yang dipadankan dengan indeks yang lebih besar daripada nilai yang diberikan

Contoh:

Salin kod Kod adalah seperti berikut:

$("li:gt(0)" ).css ("warna", "hijau");

7. :lt pemilih

Format:

Salin kod Kod adalah seperti berikut:

$("selector:lt(index)" )

Digunakan untuk memilih semua elemen daripada set yang dipadankan dengan indeks yang lebih besar daripada nilai yang diberikan

Contoh:

Salin kod Kod adalah seperti berikut:

$("li:lt(5)" ).css ("warna", "hijau");

Untuk mencari semua elemen dengan indeks lebih besar daripada n1 dan kurang daripada n2, anda boleh menggunakan pemilih tatasusunan,

Salin kod Kod adalah seperti berikut:

$("selector:gt(n1), selector:lt(n2 )") ;

8 :bukan pemilih

Format:

Salin kod Kod adalah seperti berikut:

$("selector1:not(selector2)" )

Digunakan untuk mengalih keluar semua elemen yang sepadan dengan pemilih yang diberikan daripada set yang dipadankan

Contoh:

Salin kod Kod adalah seperti berikut:

$("td:not(:first, :last) ").css("background", "red"); //Kecuali sel pertama dan terakhir, warna latar belakang sel lain ialah merah

9. :pemilih pengepala

Format:

Salin kod Kod adalah seperti berikut:

$(":header")

untuk pemilihan Semua elemen tajuk seperti h1, h2, h3

10. :pemilih animasi

Format:

Salin kod Kod adalah seperti berikut:

$("selector:animated")

digunakan Pilih semua elemen yang menjalankan animasi

Contoh mudah:

Salin kod Kod adalah seperti berikut:

 
 
 
 
过滤选择器 
 

• Analisis mendalam bagi komponen kumpulan senarai Bootstrap
• Penjelasan terperinci tentang fungsi JavaScript kari
• Contoh lengkap penjanaan kata laluan JS dan pengesanan kekuatan (dengan muat turun kod sumber demo)
• Angularjs menyepadukan UI WeChat (weui)
• Cara cepat bertukar antara Cina Tradisional dan Cina Ringkas dengan JavaScript dan helah untuk tapak web menyokong pertukaran antara kemahiran_javascript Cina Ringkas dan Tradisional