CSS Selektory

CSS Selektory

Silnik selektorów parsuje tekst selektora CSS do ustrukturyzowanej formy i ocenia go względem drzew DOM. Obsługuje zarówno bezpośrednie zapytania, jak i dopasowywanie reguł kaskady.


Uruchamianie selektorów

select() ocenia selektor względem drzewa i zwraca dopasowania; element_matches() testuje pojedynczy element. Oba akceptują standardową składnię selektorów — selektory typu, klasy, identyfikatora, atrybutu i pseudo-klasy, w tym kombinacje złożone i skomplikowane.

Zparsowane struktury selektorów

parse() tworzy SelectorList ComplexSelector i CompoundSelector wpisów zbudowanych z TypeSelector, ClassSelector, IDSelector, AttributeSelector (z AttributeOperator), UniversalSelector oraz Combinator części.

Pseudo-klasy

Funkcjonalne pseudo-klasy są modelowane jawnie: IsPseudoClass, WherePseudoClass, HasPseudoClass, ComplexNotPseudoClass oraz strukturalne warianty nth-child za pomocą NthFilteredChildPseudoClass z NthArgument.

Specificity

specificity() oblicza standardowy trójskładnikowy krotkę dla selektora, a max_specificity() redukuje listę; match() łączy parsowanie i ewaluację. Są to te same wartości używane przez kaskadę, więc wyniki zapytań i obliczone style zawsze się zgadzają.


Wskazówki i najlepsze praktyki

  • Użyj element_matches() wewnątrz filtrów zamiast ponownego uruchamiania select() dla każdego elementu
  • Parsuj raz i ponownie użyj SelectorList, gdy ten sam selektor jest stosowany do wielu drzew
  • Gdy reguła nieoczekiwanie traci kaskadę, porównaj wartości specificity() bezpośrednio

Typowe problemy

ProblemPrzyczynaNaprawa
Selektor nie dopasowuje niczegoBłąd składni w tekście selektoraparse() zostaje podniesiony przez syntax_error — sprawdź komunikat
Powiązania o równej specyficzności rozstrzygają się „źle”Zależność od kolejnościPóźniejsze reguły wygrywają w przypadku remisu; sprawdź kolejność reguł
:is() vs :where() zamieszanie:where() przyczynia się do zerowej specyficznościWybierz zgodnie z zamierzoną wagą kaskady

FAQ

Jak przetestować jeden element względem selektora?

element_matches() — zwraca wartość boolowską bez przeszukiwania drzewa.

Jak obliczana jest specyficzność?

specificity() zwraca standardową krotkę (id, class, type); grupy :where() wnoszą zero.

Jakie pseudo-klasy są obsługiwane?

Strukturalne formy w API: :is(), :where(), :has(), :not() z złożonymi argumentami oraz selektory strukturalne w stylu nth-child.


API Reference Podsumowanie

Klasa/MetodaOpis
selectOceń selektor względem drzewa
element_matchesTest jednego elementu
parsePrzetwórz tekst selektora na SelectorList
specificityOblicz krotkę specyficzności
HasPseudoClassUstrukturyzowana forma :has()
AttributeSelectorMatcher atrybutów z operatorami

Zobacz także

 Polski