В библиотеке jQuery имется возможность использования области применения селекторов, с помощью контекста.
Что такое контекст в jQuery? Давайте рассмотрим “стандартную” запись кода на JavaScript(jQuery):
$('li').addClass('someClass');Видим в этом коде, что функции $() передается один аргумент - в данном случае это селектор li. В качестве селектора может быть фрагмент разметки, имя класса или имя идентификатора. Но - в 90% случаев функции $() передается один аргумент.
Однако это не является правилом. И функции $() можно передавать не один, а два аргумента.
В этом случае второй аргумент является контекстом и служит для указания области дерева DOM, внутри которой необходимо осуществлять поиск.
То есть, запись вида:
$('li').addClass('someClass');… говорит - найти все элементы li во всем дереве DOM. Другими словами, отсутствие второго аргумента подразумевает область применения селекторов - все дерево DOM.
А вот запись вида:
$('li','#primo').addClass('block__item--first');… говорит, что нужно найти все селекторы li внутри элемента с идентификатором #primo. Другими словами, идентификатор #primo ограничивает область применения (или область видимости - как больше нравиться) селектора li.
Можно слегка усложнить область видимости селекторов - указать не одну область, а две области:
$('li','#primo,#tetro').addClass('block__item--first');… в этом случае будут возвращены только те элементы li, которые находятся внутри блока с идентификатором #primo и внутри блока с идентификатором #tetro. Другими словами, были заданы две области видимости для селектора li.
В качестве второго аргумента (контекста) функции $() может быть передан не только селектор, имя класса или имя идентификатора (как в рассмотренном выше случае).
Контекстом может быть результат работы другой функции! То есть, можно одной функции выборки передавать результат выборки другой функции!
Например, таким гипотетическим образом:
$('a',$('#primo > li')).addClass('block__link--decor');На этом все.