CSS סלקטורים
CSS סלקטורים
מנוע הסלקטורים מפרש את טקסט הסלקטור של CSS לצורה מובנית ומעריך אותו כנגד עצי DOM. הוא תומך גם בשאילתות ישירות וגם בהתאמת כללי הקסקדה.
הרצת סלקטורים
select() מעריך סלקטור נגד עץ ומחזיר התאמות; element_matches() בודק אלמנט יחיד. שניהם מקבלים תחביר סלקטור סטנדרטי — סוג, מחלקה, id, תכונה, וסלקטורים של פסודו-מחלקה, כולל שילובים מורכבים וקומפאונדיים.
מבני סלקטורים מפוענחים
parse() מייצר SelectorList של ComplexSelector ו-CompoundSelector רשומות שנבנו מ-TypeSelector, ClassSelector, IDSelector, AttributeSelector (עם AttributeOperator), UniversalSelector, ו-Combinator חלקים.
פסודו-מחלקות
מחלקות מזוייף פונקציונליות מתוּארות במפורש: IsPseudoClass, WherePseudoClass, HasPseudoClass, ComplexNotPseudoClass, וגרסאות מבניות nth-child דרך NthFilteredChildPseudoClass עם NthArgument.
Specificity
specificity() מחשבת את ה-tuple הסטנדרטי בעל שלושת הרכיבים עבור בורר, ו-max_specificity() מצמצמת רשימה; match() מחברת את הפענוח וההערכה יחד. אלה הם אותם הערכים שהקאסקייד משתמש בו, ולכן תוצאות השאילתה והסגנונות המחושבים תמיד תואמים.
טיפים ושיטות עבודה מומלצות
- השתמש ב-
element_matches()בתוך מסננים במקום להריץ מחדש אתselect()לכל אלמנט - פענח פעם אחת והשתמש מחדש ב-
SelectorListכאשר אותו בורר רץ על פני עצים רבים - כאשר כלל מאבד את הקאסקייד באופן בלתי צפוי, השווה ישירות ערכי
specificity()
בעיות נפוצות
| בעיה | סיבה | תיקון |
|---|---|---|
| הסלקטור אינו תואם לשום דבר | שגיאת תחביר בטקסט של הסלקטור | parse() מעלה דרך syntax_error — בדוק את ההודעה |
| קשרים עם ספציפיות שווה נפתרים “לא נכון” | תלות בסדר | כללים מאוחרים מנצחים בתיקו; בדקו את סדר הכללים |
בלבול בין :is() ו-:where() | :where() תורם אפס ספציפיות | בחרו בהתאם למשקל המדרג המיועד |
FAQ
איך אני בודק אלמנט אחד מול סלקטור?
element_matches() — הוא מחזיר ערך בוליאני ללא סריקת העץ.
איך מחושבת הספציפיות?
specificity() מחזיר את הטאפלה הסטנדרטית (id, class, type); קבוצות :where() תורמות אפס.
אילו פסודו-מחלקות נתמכות?
הצורות המובנות ב-API: :is(), :where(), :has(), :not() עם ארגומנטים מורכבים, וכן סלקטורים מבניים בסגנון nth-child.
API Reference סיכום
| מחלקה/מתודה | תיאור |
|---|---|
select | הערכת בורר נגד עץ |
element_matches | בדוק אלמנט אחד |
parse | פענח טקסט של בורר ל-SelectorList |
specificity | חשב את הטופל של הספציפיות |
HasPseudoClass | טופס :has() מובנה |
AttributeSelector | מתאם תכונה עם אופרטורים |