Методы has и hasClass библиотеки jQuery

Reading time ~3 minutes

Два очень похожих метода библиотеки jQuery, служащих для фильтрации выборки - метод

1
.has()
и метод
1
.hasClass()
.

И действительно, оба этих метода похожи между собой. Чтобы было понятно, лучше сразу перейду к примерам.

Метод .has()

Метод

1
.has()
фильтрует элементы, имеющие в своем составе указанные в
1
.has()
селекторы.

Простой пример:

$('li').has('a').addClass('active');

То есть: всем элементам

1
li
, имеющим в качестве потомков (в своем составе) элемент
1
a
, присвоить класс
1
.active
.

На лицо, как бы это сказать, обратная фильтрация - справа налево. Обычно все методы библиотеки jQuery работают слева направо.

Этот метод чем-то похож на метод

1
.parent()
. В качестве примера рассмотрим такой вариант:

$('a').parent('li').addClass('active');

… что читается таким образом: всем элементам

1
li
, являющимся родителями элементов
1
a
, присвоить класс
1
.active
.

Напомню, что метод

1
.has()
работает именно с селекторами и имеет такой синтаксис:

.has('selector')

Метод .hasClass()

Метод

1
.hasClass()
очень похож по принципу действия на предыдущий метод
1
has()
- но это только кажущееся впечатление.

Во-первых, как понятно из имени метода

1
.hasClass()
, что он работает с классами, а не селекторами.

То есть, синтаксис метода

1
.hasClass()
таков:

.hasClass('class')

Во-вторых, метод

1
.hasClass()
возвращает логическое
1
true
или
1
false
, в отличие от метода
1
.has()
, который возвращает массив объектов, доступных для дальнейшей обработки.

Простой пример:

if ($('li').hasClass('active')) {
  $('li').find('a').addClass('activeLink');
} else {
  $('li').find('a').addClass('inactiveLink');
}

… что читается таким образом: если элементы

1
li
имеют класс
1
.active
, то всем элементам
1
a
, являющимся потомками элементов
1
li
, присвоить класс
1
.activeLink
; иначе всем элементам
1
a
присвоить класс
1
.inactiveLink
.

Стоит обратить внимание, что в случае метода

1
.hasClass()
имеет место быть обычный способ фильтрации элементов - слева направо; выборка сужается по мере появления новых условий.

Вот такая картина получается, с двумя этими методами -

1
.has()
и
1
.hasClass
.

На этом все.


MongoDB - создание документа

![MongoDB]({{site.url}}/images/uploads/2017/05/mongodb-logo.jpg "MongoDB")Приступили к самому основному - операциям создания, чтения, изм...… Continue reading

MongoDB - документы

Published on May 23, 2017