14/08/2018, 09:52

: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) và :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 ...

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) và :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

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:

Code RUN
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Học lập trình miễn phí tại code24h.com</title>
        <script src="https://code24h.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 code24h.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

Các loại api khác

  • jQuery Selector
  • jQuery Events

Nguồn: code24h.com

0