03/08/2018, 10:08

jQuery Selectors - Content Filter

Content Filter là nhóm các Selector dùng để xử lý nội dung chứa bên trong thẻ HTML. Ví dụ bạn muốn tìm thẻ HTML nào có nội dung rỗng thì chỉ cần ...

Content Filter là nhóm các Selector dùng để xử lý nội dung chứa bên trong thẻ HTML. Ví dụ bạn muốn tìm thẻ HTML nào có nội dung rỗng thì chỉ cần sử dụng cú pháp :empty.

Sau đây là danh sách các loại Content Filter.

1. Danh sách các Content Filter trong jQuery

Có tổng cộng 4 loại Content Filter.

Cú pháp Ý nghĩa
$( "selector:contains('value')" ) Lấy thẻ HTML mà nội dung có chứa giá trị value. DEMO
$( "selector:empty" ) Lấy thẻ HTML có nội dung rỗng. DEMO
$( "selector:has(element)" ) Lấy thẻ HTML mà nội dung bên trong có chứa thẻ element. DEMO
$( "selector:parent" ) Lấy thẻ cha đầu tiên của những thẻ không rỗng. DEMO

2. Các ví dụ Content Filter trong jQuery

Sau đây là các ví dụ cách sử dụng Content Filter.

:contains Selector

Thêm class active vào thẻ div có chứa chữ code24h.com.

Demo RUN
$("div:contains('code24h.com')").addClass("active");

:emtpy Selector

Thêm class active vào thẻ div rỗng.

Demo RUN
$("div:empty").addClass("active");

:has Selector

Thêm class active vào thẻ div có chứa thẻ p.

Demo RUN
$("div:has(p)").addClass("active");

:parent Selector

Thêm class active vào thẻ cha của thẻ p có class="delete".

Demo RUN
$("div p.delete:parent").addClass("active");

3. Lời kết

Trên là bốn cách sử dụng Content Filter trong jQuery, bài này mình dừng ở đây, bài tiếp theo chúng ta tìm hiểu về các Filter xử lý với Form.

BÀI KẾ SAU
BÀI KẾ TIẾP

Nguồn: code24h.com

Bài liên quan

Giới thiệu sơ lược về jQuery Selectors

Như các bạn đã biết, CSS3 giới thiệu những tính năng selectors cho phép chúng ta lựa chọn nhiều phần tử cụ thể trong HTML, tuy nhiên CSS selectors lại không được hỗ trợ nhiều trên các trình duyệt khác nhau. jQuery cũng có bộ selectors riêng và bộ này sẽ là cách thay thế cho những gì mà CSS3 không ...

Trần Trung Dũng viết 3 tuần trước

Bài 03: jQuery Selectors

jQuery Selectors là gì? jQuery Selectors là một trong những phần quan trọng nhất của thư viện jQuery. jQuery Selectors được dùng để chọn các phần tử HTML mà bạn muốn thao tác dựa trên id, class, thuộc tính, giá trị thuộc tính, quan hệ giữa các phần tử.... Cú pháp Để chọn một phần tử ...

Bùi Văn Nam viết 10:47 ngày 18/08/2018

Show hide content in jQuery

Hàm show() Ví dụ về show / hide content in jQuery: Trong ví dụ này, chúng ta sử dụng hàm show() và hide() để xử lý hiện, ẩn nội dung khi click. <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery. ...

Trịnh Tiến Mạnh viết 19:10 ngày 11/08/2018

jQuery Selectors - Attributes

Ở bài trước chúng ta đã được tìm hiểu về Selector trong jQuery và mình cũng có giới thiệu sơ lược cách truy vấn theo ID và Class rồi, nhưng thực ...

Hoàng Hải Đăng viết 10:12 ngày 03/08/2018

jQuery Selectors - Child Filter

Child Filter Selector cũng có chức năng giống như Basic Filter nhưng jQuery nó chia làm hai nhóm để chúng ta dễ học và dễ tìm kiếm hơn. Nhóm ...

Hoàng Hải Đăng viết 10:12 ngày 03/08/2018
0