CSS Seletores

CSS Seletores

O motor de seletores analisa o texto do seletor CSS em forma estruturada e o avalia contra árvores DOM. Ele suporta tanto consultas diretas quanto a correspondência de regras da cascata.


Executando Seletores

select() avalia um seletor contra uma árvore e retorna correspondências; element_matches() testa um único elemento. Ambos aceitam a sintaxe padrão de seletores — de tipo, classe, id, atributo e pseudo-classe, incluindo combinações compostas e complexas.

Estruturas de Seletores Analisados

parse() produz um SelectorList de ComplexSelector e CompoundSelector entradas construídas a partir de TypeSelector, ClassSelector, IDSelector, AttributeSelector (com AttributeOperator), UniversalSelector e Combinator partes.

Pseudo-Classes

Pseudo-classes funcionais são modeladas explicitamente: IsPseudoClass, WherePseudoClass, HasPseudoClass, ComplexNotPseudoClass, e variantes estruturais nth-child via NthFilteredChildPseudoClass com NthArgument.

Specificity

specificity() calcula a tupla padrão de três componentes para um seletor, e max_specificity() reduz uma lista; match() une a análise e a avaliação. Esses são os mesmos valores que a cascata usa, portanto os resultados de consultas e os estilos computados sempre concordam.


Dicas e Melhores Práticas

  • Use element_matches() dentro de filtros ao invés de reexecutar select() por elemento
  • Analise uma vez e reutilize o SelectorList quando o mesmo seletor for executado contra muitas árvores
  • Quando uma regra inesperadamente perde a cascata, compare os valores de specificity() diretamente

Problemas Comuns

ProblemaCausaCorreção
Seletor não corresponde a nadaErro de sintaxe no texto do seletorparse() gera via syntax_error — verifique a mensagem
Empates de especificidade igual resultam em “errado”Dependência de ordemRegras posteriores vencem empates; verifique a ordem das regras
Confusão :is() vs :where():where() contribui com especificidade zeroEscolha de acordo com o peso de cascata pretendido

FAQ

Como testar um elemento contra um seletor?

element_matches() — ele retorna um booleano sem percorrer a árvore.

Como a especificidade é calculada?

specificity() retorna a tupla padrão (id, class, type); :where() grupos contribuem zero.

Quais pseudo-classes são suportadas?

As formas estruturadas no API: :is(), :where(), :has(), :not() com argumentos complexos, e seletores estruturais no estilo nth-child.


API Reference Resumo

Classe/MétodoDescrição
selectAvalie um seletor contra uma árvore
element_matchesTeste um elemento
parseAnalise o texto do seletor em um SelectorList
specificityCalcule a tupla de especificidade
HasPseudoClassForma :has() estruturada
AttributeSelectorCorrespondente de atributo com operadores

Ver também

 Português