Cách dùng :not() Selector trong jQuery

Not Selector sẽ tìm kiếm tất cả các phần tử không phù hợp với selector được cung cấp.

Tất cả các selector đều có thể đặt được trong :not() selector. Ví dụ, :not(div a):not(div,a).

Phương thức .not() sẽ khiến cho các selector cũng như các biến của bạn trở nên dễ đọc hơn rất nhiều so với :not(). Do vậy trong một số trường hợp, phương thức này thích hợp hơn để sử dụng.

Cú pháp

jQuery( ":not(selector)" )

Trong đó:

  • selector là một selector bất kỳ.

Ví dụ

Tìm kiếm thẻ các thẻ theo tên class và đổi màu cho chúng:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Học lập trình miễn phí tại nguyengiatech.com</title>
        <script src="https://nguyengiatech.com/cnd/js/jquery/jquery-3.2.1.min.js"></script>
    </head>
    <body>
        <h1>Học lập trình miễn phí tại nguyengiatech.com</h1>
    
        <p class="red">Đây là thẻ p class="red"</p>
        <div class="red">Đây là thẻ div class="red" </div>
        <div class="red">Đây là thẻ div class="red" </div>
        <span class="red">Đây là thẻ span class="red" </span>
        <p>Đây là thẻ p </p>
        <p class="red">Đây là thẻ p class="red"</p>
        <div class="no">Đây là thẻ div co class = not </div>
        <br>
        <button onclick="myFunction()">Click vào đây để xem kết quả</button>
        <script>
            function myFunction(){
                $( ":not(.red)" ).css( "color", "blue");
                $( ".red" ).css( "color", "red");
            }
        </script>
    </body>
</html>

Kết quả:

 

Tham khảo: jquery.com

Bài liên quan