Первые элементы в своих родителях

:first-child1.1.4

Соответствует элементам, которые идут первыми в своих непосредственных предках.

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

$('div:first-child') вернет все div-элементы, которые идут первыми в своих предках.
$('div.lBox:first-child') вернет все div-элементы класса lBox, которые идут первыми в своих предках.

В отличии от селектора :first, который находит первый из найденных элементов (то есть результатом будет всегда один элемент), :first-child отфильтрует выбранные элементы, оставив только те, которые идут первыми в своих предках. Это различие демонстрируется в следующем примере.

В действии

Пример 1

Найдем и выделим красной рамкой все элементы p, которые лежат первыми внутри своих родителей. Кроме этого, найдем первый p-элемент и пометим его синей звездочкой:


Пример 2

Найдем женщин, стоящих в начале очереди (элементы класса women, находящиеся в начале элементов с классом queue (очередь)):

Ссылки

Поисковые ключи:
  • первые элементы в своих предках
  • first-child