jQuery – セレクタの例ではない

投稿日: 2019-11-05 2019-11-05
タグ: jquery, jquery selector

jQueryでは、セレクタと一致しないすべての要素を選択するために「

not

」が使用されます。

例

$（ ‘p:not（.class-p1）’） – <p>と一致するすべての要素を選択する

クラス名が “class-p1″ではありません。

$（ ‘li:not（:only-child）’） – <li>と一致するすべての要素を選択します

親の唯一の子ではありません。

$（ ‘li:not（:first-child）’） – <tr>でマッチした要素をすべて選択します.

親の最初の子ではありません。

jQueryの例

jQueryの “not”セレクタの使い方を示す簡単な例では、ボタンをクリックしてその周りを再生します。

<html>
<head>
<title>jQuery not example</title>

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
</head>

<body>

<h1>jQuery not example</h1>

<ul class="class-ul">
    <li>class-ul - #1</li>
    <li>class-ul - #2</li>
    <li>class-ul - #3</li>
    <li>class-ul - #4</li>
    <li>class-ul - #5</li>
</ul>

<ul id="id1">
    <li>id1 - #1</li>
</ul>

<p class="class-p1">
    class - #p1
</p>

<p class="class-p2">
    class - #p2
</p>

<button>p:not(.class-p1)</button>
<button>li:not(:only-child)</button>
<button>li:not(:first-child)</button>

<script type="text/javascript">
    $("button").click(function () {
      var str = $(this).text();
      $("li,p").css("background", "white");
      $(str).css("background", "coral");
    });
</script>

</body>
</html>

リンク://wp-content/uploads/jQuery/jQuery-not-example.html[デモを試してください]

jquery

jquery selector

getdocs

13036