.is()

В отличие от других методов фильтрации, .is() не создает новый объект jQuery. Вместо этого он позволяет проверить содержимое объекта jQuery без модификаций. Это часто полезно внутри обратных вызовов, таких как обработчики событий.

Предположим, у вас есть список, два элемента которого содержат дочерний элемент:

<ul>
  <li>list <strong>item 1</strong></li>
  <li><span>list item 2</span></li>
  <li>list item 3</li>
</ul>

Вы можете добавить обработчик клика к элементу <ul>, а затем ограничить код, чтобы он срабатывал только тогда, когда нажимается сам элемент списка, а не один из его дочерних элементов:

$( "ul" ).on( "click", function( event ) {
  var target = $( event.target );
  if ( target.is( "li" ) ) {
    target.css( "background-color", "red" );
  }
});

Теперь, когда пользователь нажимает на слово "список" в первом элементе или где-либо во втором или третьем элементе, нажатый элемент списка получит красный фон. Однако, когда пользователь нажимает на элемент 1 в первом элементе или где-либо во втором элементе, ничего не произойдёт, потому что в этих случаях целевым элементом события будет <strong> или <span>, соответственно.

Использование функции

Вторая форма этого метода оценивает выражения, относящиеся к элементам, на основе функции, а не селектора. Для каждого элемента, если функция возвращает true, то .is() также возвращает true. Например, учитывая фрагмент HTML посложнее:

<ul>
  <li><strong>list</strong> item 1 - one strong tag</li>
  <li><strong>list</strong> item <strong>2</strong> -
    two <span>strong tags</span></li>
  <li>list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>

Вы можете добавить обработчик клика ко всем <li>, которые оценивают количество <strong> элементов внутри нажатого <li> в этот момент:

$( "li" ).on( "click", function() {
  var li = $( this ),
    isWithTwo = li.is(function() {
      return $( "strong", this ).length === 2;
    });
  if ( isWithTwo ) {
    li.css( "background-color", "green" );
  } else {
    li.css( "background-color", "red" );
  }
});