JS - Content Filter Selector

by My Love

22/04/2019, 10:17 AM   |    22/04/2019, 10:17 AM   |    659   |    0

      Nhóm Content Filter Selector trong jQuery dùng để lấy các thẻ mà nội dung bên trong thẻ đó chứa giá trị bạn muốn tìm. Có 4 loại Content Filter Selector
1. Danh sách Content Filter Selector trong jQuery
      Bảng Content Filter Selector  :
Cú pháp Ý nghĩa
$( "selector:contains('value')" ) Lấy các thẻ mà nội dung có chứa giá trị value truyền vào
$( "selector:empty" ) Lấy các thẻ mà có nội dung là rỗng ( không có văn bản text ) hoặc không có ít nhất một phần tử con.
$( "selector:has(element)" ) Lấy thẻ mà nội dung bên trong có chứa thẻ element cần tìm
$( "selector:parent" ) Lấy thẻ cha đầu tiên của các thẻ không rỗng ( có văn bản text ) hoặc có ít nhất một phần tử con.

2. Một số ví dụ

:contains selector
      Thêm class cho thẻ có chứa nội dung cần tìm là 'Messi' :
<script language="javascript">
     $(document).ready(function(){
            
          $(".my-class:contains('Messi')").addClass('active');
            
     });
</script>

:empty selector
      Thêm class cho các thẻ có nội dung rỗng hoặc không có ít nhất một thẻ con.
<script language="javascript">
     $(document).ready(function(){
            
          $(".my-class:empty").addClass('active');
            
     });
</script>

:has selector
      Thêm class vào các thẻ có chứa thẻ  <p>
<script language="javascript">
     $(document).ready(function(){
            
          $("div:has(p)").addClass('active');
            
     });
</script>
:parent selector
      Thêm class cho thẻ cha đầu tiên của các thẻ không rỗng ( có văn bản text ) hoặc có ít nhất một phần tử con.
<script language="javascript">
     $(document).ready(function(){
            
          $(".my-class:parent").addClass('active');
            
     });
</script>