jQuery traversal - penapisan

jQuery traversal - penapisan

Julat singkatan elemen carian

Tiga kaedah penapisan paling asas ialah: first(), last() dan eq() , mereka membenarkan anda memilih elemen tertentu berdasarkan kedudukannya dalam satu set elemen.

Kaedah penapisan lain seperti penapis() dan bukan() membolehkan anda memilih elemen yang sepadan atau tidak sepadan dengan kriteria yang ditentukan.

kaedah jQuery first()

kaedah first() mengembalikan elemen pertama bagi elemen yang dipilih.

Contoh berikut memilih elemen <p> pertama di dalam <div> elemen pertama:

Contoh

$(document).ready(function(){
  $("div p").first();
});

kaedah jQuery last()

kaedah last() mengembalikan elemen terakhir elemen yang dipilih.

Contoh berikut memilih elemen <p> terakhir dalam elemen <div>

Contoh

$(document).ready(function(){
  $("div p").last();
});

kaedah jQuery eq()

kaedah eq() mengembalikan elemen dengan nombor indeks yang ditentukan antara elemen yang dipilih.

Indeks bermula pada 0, jadi elemen pertama mempunyai indeks 0 dan bukannya 1. Contoh berikut memilih elemen <p> kedua (nombor indeks 1):

Instance

$(document).ready(function(){
  $("p").eq(1);
});

kaedah jQuery filter()

filter The () kaedah membolehkan anda menentukan kriteria. Elemen yang tidak sepadan dengan kriteria ini dialih keluar daripada koleksi dan elemen sepadan dikembalikan.

Contoh berikut mengembalikan semua <p> elemen dengan nama kelas "intro":

Instance

$(document).ready(function(){
  $("p").filter(".intro");
});

kaedah jQuery not() < Kaedah 🎜>

not() mengembalikan semua elemen yang tidak sepadan dengan kriteria.

Petua: Kaedah not() adalah bertentangan dengan penapis().

Contoh berikut mengembalikan semua <p> elemen tanpa nama kelas "intro":

Instance

$(document).ready(function(){  
$("p").not(".intro");
});


Meneruskan pembelajaran
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("div p").first().css("background-color","green"); }); </script> </head> <body> <h1>欢迎访问我的主页</h1> <div> <p>我是div中的一个段落。</p> </div> <div> <p>我是另外一个div中的一个段落。</p> </div> <p>我是一个段落。</p> </body> </html>
  • Cadangan kursus
  • Muat turun perisian kursus