jQuery not() 方法

jQuery 中的not()方法用於從匹配元素集中過濾掉元素。換句話說，它從匹配元素集中刪除與指定選擇器匹配的元素。

語法

以下是 jQuery 中 not() 方法的語法：

$(selector).not(criteria,function(index))

引數

此方法接受以下引數：

criteria: 一個選擇器表示式、元素或 jQuery 物件，指示要移除的元素。
function(index): 可選的回撥函式，用於對匹配集中每個元素執行，其中index表示當前元素的索引。

示例 1

在下面的示例中，我們使用 not() 方法來選擇所有沒有類名“demo”的元素：

<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  $(document).ready(function(){
    $("button").click(function(){
      $("p").not(".demo").css("border", "2px solid green")
    })
  });
</script>
</head>
<body>
<p class="demo">Paragraph element (with class demo).</p>
<p>Paragraph element.</p>
<p class="demo">Paragraph element (with class demo).</p>
<p>Paragraph element.</p>
<p class="demo">Paragraph element (with class demo).</p>
<button>Click</button>
</body>
</html>

當我們執行上述程式時，所有沒有類名“demo”的元素都將以實心綠色邊框突出顯示。

示例 2

在這個示例中，我們返回所有沒有類“demo”和 id“dummy”的元素：

<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  $(document).ready(function(){
    $("button").click(function(){
      $("p").not(".demo, .dummy").css("border", "2px solid green")
    })
  });
</script>
</head>
<body>
<p class="demo">Paragraph element (with class demo).</p>
<p>Paragraph element.</p>
<p class="demo">Paragraph element (with class demo).</p>
<p>Paragraph element.</p>
<p>Paragraph element.</p>
<p class="dummy">Paragraph element (with class dummy).</p>
<button>Click</button>
</body>
</html>

當我們執行上述程式時，所有沒有類名“demo”和“dummy”的元素都將以實心綠色邊框突出顯示。

示例 3

這裡，我們選擇所有沒有類“demo”和 id“dummy”的<p>元素：

<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  $(document).ready(function(){
    $("button").click(function(){
      $("p").not($("p.demo, p.dummy")).css("border", "2px solid green")
    })
  });
</script>
</head>
<body>
<p class="demo">Paragraph element (with class demo).</p>
<p>Paragraph element.</p>
<p class="demo">Paragraph element (with class demo).</p>
<p>Paragraph element.</p>
<p>Paragraph element.</p>
<p class="dummy">Paragraph element (with class dummy).</p>
<button>Click</button>
</body>
</html>

執行上述程式後，所有沒有類名“demo”和“dummy”的<p>元素都將以實心綠色邊框突出顯示。

示例 4

這裡，我們返回所有沒有 id“demo”的元素，使用 DOM 元素：

<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  $(document).ready(function(){
    $("button").click(function(){
      $("p").not(document.getElementById("demo")).css("border", "2px solid green")
    })
  });
</script>
</head>
<body>
<p id="demo">Paragraph element (with class demo).</p>
<p>Paragraph element.</p>
<p>Paragraph element.</p>
<p>Paragraph element.</p>
<button>Click</button>
</body>
</html>

執行上述程式後，所有沒有類名“demo”的元素都將以實心綠色邊框突出顯示。

jquery_ref_traversing.htm

列印頁面