Каков приоритет оператора + в CSS-селекторах?

E + F соответствует любому элементу F, которому сразу предшествует элемент sibling E.

Как насчет приоритета оператора? Что соответствует #id1 #id2 + #id3? Что насчет #id1 + #id2 #id3?

Есть ли селектор, который означает #id1 (#id2 + #id3) или (#id1 + #id2) #id3? (Я предполагаю, что ( и ) не разрешены в CSS-селекторах, я не вижу их в спецификации)

Ответ 1

Каждая последовательность простых селекторов и комбинаторов считывается браузерами справа налево линейным образом. Комбинаторы никак не влияют на порядок. Самый правый селектор после последнего комбинатора, если он есть, известен как селектор ключей (см. Ссылки ниже для более подробной информации), и который идентифицирует элемент, к которому применяется правило (также известный как субъект селектора, хотя обратите внимание, что селектор клавиш может не всегда представлять объект селектора, поскольку разные приложения реализуют селектора по-разному).

Селектор #id1 #id2 + #id3 означает

Выбрать элемент #id3
если он непосредственно следует за братом #id2
то есть потомок #id1.

Структура DOM, в которой #id3 будет соответствовать селектору, будет выглядеть так:

#id1
  ... any level of nesting
    #id2
    #id3

Пока #id1 + #id2 #id3 означает

Выбрать элемент #id3
если он является потомком #id2
который непосредственно следует за сестрой #id1.

И структура DOM, в которой #id3 будет соответствовать селектору, будет выглядеть так:

#id1
#id2
  ... any level of nesting
    #id3

Обратите внимание на разницу в позиции элемента #id2 в этой структуре DOM по сравнению с предыдущей.

Здесь нет большой проблемы с приоритетом, так как комбинаторы потомков и родных братьев идут в разных направлениях в DOM. Обе селекторные последовательности читаются справа налево в любом случае.

Похожие ответы: