jQuery Truy vấn - phương pháp prevAll()

jQuery Hướng dẫn Truy vấn

Mô hình

Định vị tất cả các div trước div cuối cùng và thêm lớp cho chúng:

$("div:last").prevAll().addClass("before");

Thử trực tiếp

Định nghĩa và cách sử dụng

prevAll() nhận được các phần tử anh em trước của mỗi phần tử trong bộ sưu tập phần tử khớp hiện tại, việc lọc bằng biểu thức chọn lọc là tùy chọn.

Cú pháp

.prevAll(selector)
Tham số Mô tả
selector Giá trị chuỗi, chứa biểu thức chọn lọc để khớp với phần tử.

Giải thích chi tiết

Nếu cung cấp một đối tượng jQuery biểu thị bộ sưu tập phần tử DOM, phương pháp .prevAll() cho phép chúng ta tìm kiếm các phần tử anh em trước đó trong cây DOM và tạo một đối tượng jQuery mới từ các phần tử khớp.

Phương pháp này chấp nhận biểu thức chọn lọc tùy chọn, giống với loại tham số chúng ta truyền vào hàm $(). Nếu áp dụng biểu thức chọn lọc này, các phần tử sẽ được lọc qua việc kiểm tra xem chúng có khớp với biểu thức chọn lọc hay không.

Hãy suy nghĩ về trang này với danh sách đệm cơ bản:

<ul>
   <li>đối tượng danh sách 1</li>
   <li>đối tượng danh sách 2</li>
   <li class="third-item">đối tượng danh sách 3</li>
   <li>đối tượng danh sách 4</li>
   <li>đối tượng danh sách 5</li>
</ul>

Nếu chúng ta bắt đầu từ mục thứ ba, chúng ta có thể tìm thấy các phần tử anh em giữa chúng:

$('li.third-item').prevAll().css('background-color', 'red');

Thử trực tiếp

Kết quả được gọi ở đây là đặt nền đỏ cho mục 2 và mục 1. Do chúng ta chưa áp dụng biểu thức chọn lọc, các phần tử trước đó tự nhiên trở thành một phần của đối tượng. Nếu đã áp dụng biểu thức chọn lọc, các phần tử này sẽ được kiểm tra xem chúng có khớp với biểu thức chọn lọc hay không trước khi bao gồm phần tử.

jQuery Hướng dẫn Truy vấn