CSS Seçiciler

CSS Seçiciler

Seçici motoru, CSS seçici metnini yapılandırılmış forma dönüştürür ve DOM ağaçları üzerinde değerlendirir. Hem doğrudan sorguları hem de cascade kural eşleştirmesini destekler.


Seçicileri Çalıştırma

select() bir seçiciyi bir ağaç üzerinde değerlendirir ve eşleşmeleri döndürür; element_matches() tek bir öğeyi test eder. Her ikisi de standart seçici sözdizimini — tip, sınıf, kimlik, öznitelik ve pseudo-sınıf seçicileri, birleşik ve karmaşık kombinasyonlar dahil — kabul eder.

Çözülmüş Seçici Yapıları

parse(), TypeSelector, ClassSelector, IDSelector, AttributeSelector (with AttributeOperator), UniversalSelector ve Combinator parçalarından oluşturulan ComplexSelector ve CompoundSelector girişlerinden oluşan bir SelectorList üretir.

Pseudo-Sınıflar

Fonksiyonel pseudo-sınıflar açıkça modellenir: IsPseudoClass, WherePseudoClass, HasPseudoClass, ComplexNotPseudoClass ve yapısal nth-child varyantları NthFilteredChildPseudoClass üzerinden NthArgument ile.

Specificity

specificity(), bir seçici için standart üç bileşenli demeti hesaplar ve max_specificity() bir listeyi azaltır; match() ayrıştırma ve değerlendirmeyi birleştirir. Bunlar, kademenin kullandığı aynı değerlerdir, bu yüzden sorgu sonuçları ve hesaplanan stiller her zaman uyumludur.


İpuçları ve En İyi Uygulamalar

  • Filtrelerin içinde element_matches() kullanın, her öğe için select()’i yeniden çalıştırmak yerine
  • Bir kez ayrıştırın ve aynı seçici birçok ağaçta çalıştırıldığında SelectorList’ı yeniden kullanın
  • Bir kural beklenmedik şekilde kademeyi kaybettiğinde, specificity() değerlerini doğrudan karşılaştırın

Yaygın Sorunlar

SorunNedenDüzeltme
Seçici hiçbir şeyle eşleşmiyorSeçici metninde sözdizimi hatasıparse(), syntax_error aracılığıyla tetikler — mesajı kontrol edin
Eşit özgüllük bağları “yanlış” şekilde çözülürSıra bağımlılığıDaha sonraki kurallar eşitliği kazanır; kural sırasını kontrol edin
:is() vs :where() karışıklığı:where() sıfır özgüllük katkısı sağlarİstenen kademeli ağırlığa göre seçin

FAQ

Bir öğeyi bir seçiciye karşı nasıl test ederim?

element_matches() — ağaç taraması yapmadan bir boolean döndürür.

Özgüllük nasıl hesaplanır?

specificity() standart (id, class, type) bileşen demetini döndürür; :where() grupları sıfır katkı sağlar.

Hangi pseudo-sınıflar destekleniyor?

Yapısal formlar API içinde: :is(), :where(), :has(), :not() karmaşık argümanlarla ve nth-child tarzı yapısal seçiciler.


API Reference Özeti

Sınıf/YöntemAçıklama
selectBir seçiciyi ağaç üzerinde değerlendir
element_matchesBir öğeyi test et
parseSeçici metnini bir SelectorList içine ayrıştır
specificitySpesifiklik demetini hesapla
HasPseudoClassYapılandırılmış :has() formu
AttributeSelectorOperatörlerle öznitelik eşleştirici

Ayrıca Bakınız

 Türkçe