Tự học JQuery - Traversing - Bài 5 - Lọc – Filtering

Xem Mục lục lập trình JQuery

Thu hẹp kết quả tìm kiếm phần tử

03 phương thức lọc cơ bản nhất là first(), last() và eq(), cho phép bạn chọn lựa 01 phần tử dựa trên vị trí của nó trong 01 nhóm phần tử.

Những phương thức lọc khác như filter() và not() cho phép bạn chọn phần tử trùng hoặc không trùng điều kiện lọc.

Phương thức jQuery first()

Phương thức first() trả về phần tử đầu tiên trong các phần tử đã chọn.

Ví dụ sau chọn phần tử <p> đầu tiên trong bên trong phần tử <div> đầu tiên:

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

Phương thức jQuery last()

Phương thức last() trả về phần tử cuối cùng trong các phần tử đã chọn lựa.

Ví dụ sau chọn phần tử <p> cuối cùng trong thẻ <div> cuối cùng:

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

Phương thức jQuery eq()

Phương thức eq() trả về 01 phần tử ở 01 vị trí nhất định trong các phần tử đã chọn.

Con số vị trí của phần tử bắt đầu từ 0 => phần tử đầu tiên có chỉ số là 0.

Ví dụ sau chọn phần tử <p> (số index = 1):

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

Phương thức jQuery filter()

Phương thức filter() cho phép bạn xác định 01 điều kiện lọc.

Những phần tử không thỏa điều kiện lọc sẽ bị xóa khỏi vùng chọn, và những phần tử thỏa điều kiện sẽ được trả về.

Ví dụ trả về tất cả phần tử <p> với tên lớp là "intro":

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

Phương thức jQuery not()

Phương thức not() trả về tất cả phần tử không khớp với điều kiện lọc.

Mẹo: phương thức not() là ngược lại với phương thức filter().

Ví dụ sau trả về tất cả thẻ <p> không có tên lớp là "intro":

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

Nếu vẫn chưa rõ các bạn xem thêm video clip sau:

Xem Mục lục lập trình JQuery

By #drM