jQuery 「走査系のメソッド」要素が条件にマッチするかチェックする

対象となる要素集合のうち、1つでもis()で与えた引数の条件にマッチした場合、trueを返します。マッチしなければfalseを返します。他の走査系メソッドとは異なり、is()はjQueryオブジェクトを返さず、trueまたはfalseを返します。対象となるjQueryオブジェクトに対しては一切の変更を加えませんので、jQueryオブジェクトはそのままで要素を調べたいときに有効なメソッドです。3番目の書式、コールバック関数を引数とする場合、コールバック関数の戻り値もtureまたはfalseのブール値である必要があります。また、コールバック関数内では「this」で対象となる要素集合を参照できます。

書式

.is( セレクタ )
.is( 要素 )
.is( 関数 )
$('#myelem').is(':first-child')
$('#myelem').is(function(){
:
});

サンプル

正しい解答(.correct)をクリックしたら「正解」を表示する

 <body>
    <div class="main">
      <div class="header">
        <h1> サンプル </h1>
      </div>
      <div class="content">
        <h3>ペットが食べても良いものは?</h3>
        <p id="zero" class="sticky4">焼肉</p> 
        <p id="one" class="sticky4">パスタ</p>
        <p id="five" class="correct sticky4">ドックフード</p>
        <p id="six" class="correct sticky4">キャットフード</p>
        <p id="seven" class="sticky4">牛乳瓶</p>
        <div class="desc"></div>
      </div>
      <div class="footer">
        <hr>
        <p class="copyright">2024 xxxx all rights reserved.</p>
      </div>
    </div>
    <script>
      $(document).ready(function(){
       $('.sticky4').on('click',function(){
        $(this).css('backgroundColor','yellow');
        if($(this).is('.correct')){
          $('.desc').text('正解');
        }else{
          $('.desc').text('不正解');
        }
       });
      });
    </script>
実行結果
初期画面
実行結果
正解を選択した場合
実行結果
不正解を選択した場合