Нисходящие селекторы

("outer inner")1.0

Соответствует элементам удовлетворяющим селектору inner, которые являются потомками (лежат внутри) элементов, удовлетворяющих селектору outer. В отличии от дочернего селектора (outer > inner), с помощью которого производится поиск элементов только на первом уровне вложенности в outer, нисходящий селектор задает поиск на всех уровнях вложенности.

Примеры использования:

$('div span') вернет все span-элементы, которые лежат внутри элементов div.
$('div .lBlock .line') вернет элементы с классом line, лежащие в элементах класса lBlock, которые в свою очередь находятся внутри div-элементов.
$('#foot *') вернет все элементы, лежащие внутри элемента с идентификатором foot.

В действии

Пример 1

Найдем бомбы в коробках (элементы класса bomb, лежащие внутри элементов класса box):

Пример 2

Найдем всех потомков, внутри второго ul-элемента, а внутри последнего ul-элемента найдем все дочерние элементы (с помощью дочернего селектора):

Ссылки

Поисковые ключи:
  • потомки
  • иерархия элементов
  • нисходящие селекторы
  • поиск элементов с учетом иерархии