You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: selectors-4/Overview.bs
+49-39Lines changed: 49 additions & 39 deletions
Original file line number
Diff line number
Diff line change
@@ -17,7 +17,7 @@ Former Editor: Daniel Glazman
17
17
Former Editor: Ian Hickson
18
18
Former Editor: Peter Linss
19
19
Former Editor: John Williams
20
-
Abstract: <b>Selectors</b> are patterns that match against elements in a tree, and as such form one of several technologies that can be used to select nodes in a document. Selectors have been optimized for use with HTML and XML, and are designed to be usable in performance-critical code. They are a core component of <abbr title="Cascading Style Sheets">CSS</abbr> (Cascading Style Sheets), which uses Selectors to bind style properties to elements in the docu ment.
20
+
Abstract: <a>Selectors</a> are patterns that match against elements in a tree, and as such form one of several technologies that can be used to select nodes in a document. Selectors have been optimized for use with HTML and XML, and are designed to be usable in performance-critical code. They are a core component of <abbr title="Cascading Style Sheets">CSS</abbr> (Cascading Style Sheets), which uses Selectors to bind style properties to elements in the docu ment.
21
21
Abstract: Selectors Level 4 describes the selectors that already exist in [[!SELECT]], and further introduces new selectors for CSS and other languages that may need them.
22
22
At Risk: the column combinator
23
23
At Risk: the '':drop()'' pseudo-class
@@ -40,7 +40,7 @@ Introduction</h2>
40
40
41
41
<em>This section is not normative.</em>
42
42
43
-
A <dfn>selector</dfn> is a boolean predicate
43
+
A <a>selector</a> is a boolean predicate
44
44
that takes an element in a tree structure
45
45
and tests whether the element matches the selector or not.
46
46
@@ -538,11 +538,16 @@ Selector Syntax and Structure</h2>
538
538
<h3 id="structure">
539
539
Structure and Terminology</h3>
540
540
541
+
A <dfn>selector</dfn> represents
542
+
a particular pattern of element(s) in a tree structure.
541
543
The term <a>selector</a> can refer to a <a>simple selector</a>,
542
544
<a>compound selector</a>, <a>complex selector</a>, or <a>selector list</a>.
545
+
The <dfn export for=selector lt="subject|subject of a selector">subject of a selector</dfn> is
546
+
any element that selector is defined to be about;
547
+
that is, any element <dfn export lt="match">matching</dfn> that <a>selector</a>.
543
548
544
549
A <dfn id="simple" export>simple selector</dfn>
545
-
represents an element matched by a particular aspect.
550
+
is a single condition on an element.
546
551
A <a>type selector</a>,
547
552
<a>universal selector</a>,
548
553
<a>attribute selector</a>,
@@ -552,35 +557,59 @@ Structure and Terminology</h3>
552
557
is a <a>simple selector</a>.
553
558
It is represented by <<simple-selector>>
554
559
in the selectors <a href="#grammar">grammar</a>.
560
+
A given element is said to <a>match</a> a <a>simple selector</a>
561
+
when that <a>simple selector</a>,
562
+
as defined in this specification and in accordance with the <a>document language</a>,
563
+
accurately describes the element.
555
564
556
565
A <dfn id="compound" export>compound selector</dfn>
557
566
is a sequence of <a>simple selectors</a>
558
-
that are not separated by a <a>combinator</a>.
559
-
It represents an element that matches all of the <a>simple selectors</a> it contains.
567
+
that are not separated by a <a>combinator</a>,
568
+
and represents a set of simultaneous conditions on a single element.
560
569
If it contains a <a>type selector</a> or <a>universal selector</a>,
561
570
that selector must come first in the sequence.
562
571
Only one type selector or universal selector is allowed in the sequence.
563
572
A <a>compound selector</a> is represented by <<compound-selector>>
564
573
in the selectors <a href="#grammar">grammar</a>.
574
+
A given element is said to <a>match</a> a <a>compound selector</a>
575
+
when it matches all <a>simple selectors</a> in the <a>compound selector</a>.
565
576
566
577
Note: As whitespace represents the <a>descendant combinator</a>,
567
578
no whitespace is allowed between the <a>simple selectors</a>
568
579
in a <a>compound selector</a>.
569
580
581
+
A <dfn export for=selector>combinator</dfn>
582
+
is a condition of relationship between two elements
583
+
represented by the <a>compound selectors</a> on either side.
584
+
Combinators in Selectors Level 4 include:
585
+
the <a>descendant combinator</a> (white space),
586
+
the <a>child combinator</a> (U+003E, <code>></code>),
587
+
the <a>next-sibling combinator</a> (U+002B, <code>+</code>),
588
+
and the <a>subsequent-sibling combinator</a> (U+007E, <code>~</code>).
589
+
Two given elements are said to <a>match</a> a <a>combinator</a>
590
+
when the condition of relationship between these elements is true.
591
+
570
592
A <dfn id="complex" export>complex selector</dfn> is
571
593
a sequence of one or more <a>compound selectors</a>
572
594
separated by <a>combinators</a>.
573
-
It represents an element in a particular relationship to other elements.
595
+
It represents a set of simultaneous conditions
596
+
on a set of elements in the particular relationships
597
+
described by its <a>combinators</a>.
574
598
Complex selectors are represented by <<complex-selector>>
575
599
in the selectors <a href="#grammar">grammar</a>.
576
-
577
-
A <dfn export for=selector>combinator</dfn> represents a particular kind of relationship
578
-
between the elements matched by the <a>compound selectors</a> on either side.
579
-
Combinators in Selectors level 4 include:
580
-
the <a>descendant combinator</a> (white space),
581
-
the <a>child combinator</a> (U+003E, <code>></code>),
582
-
the <a>next-sibling combinator</a> (U+002B, <code>+</code>),
583
-
and the <a>subsequent-sibling combinator</a> (U+007E, <code>~</code>).
600
+
A given element is said to <a>match</a> a <a>complex selector</a>
601
+
when there exists a list of elements,
602
+
each matching a corresponding <a>compound selector</a> in the <a>complex selector</a>,
603
+
with their relationships matching the <a>combinators</a> between them,
604
+
and with the given element matching the last <a>compound selector</a>.
605
+
606
+
Note: Thus, a selector consisting of a single <a>compound selector</a>
607
+
matches any element satisfying the requirements
608
+
of its constituent <a>simple selectors</a>.
609
+
Prepending another <a>compound selector</a> and a <a>combinator</a>
610
+
to a sequence imposes additional matching constraints,
611
+
such that the <a>subjects</a> of a <a>complex selector</a> are always
612
+
a subset of the elements represented by its last <a>compound selector</a>.
584
613
585
614
A <dfn export lt="list of simple selectors|list of compound selectors|list of complex selectors">list of simple/compound/complex selectors</dfn>
586
615
is a comma-separated list of
@@ -591,34 +620,15 @@ Structure and Terminology</h3>
591
620
when the type is either unimportant or specified in the surrounding prose;
592
621
if the type is important and unspecified,
593
622
it defaults to meaning a <a>list of complex selectors</a>.
594
-
See [[#grouping]] for further details on <a>selector lists</a>
595
-
and the various <<*-selector-list>> productions in the <a href="#grammar">grammar</a>.
596
-
597
-
The <dfn export for=selector lt="subject|subject of a selector">subject of a selector</dfn> is
598
-
the element(s) that selector is defined to be about:
599
-
600
-
<ul>
601
-
<li>For a <a>simple selector</a>, it is any element represented by that selector.
602
-
<li>For a <a>compound selector</a>, it is any element that matches all of its composite <a>simple selectors</a>.
603
-
<li>For a <a>complex selector</a>, it is any element that matches the last <a>compound selector</a> in the selector.
604
-
<li>For a <a>selector list</a>, it is any element that matches any of the <a>selectors</a> in the list.
605
-
</ul>
606
-
607
-
An element is said to <dfn for=selector export>match</dfn> a selector
608
-
if it is a <a>subject</a> of that selector.
609
-
Thus a selector consisting of a single <a>compound selector</a>
610
-
matches any element satisfying its requirements.
611
-
Prepending another <a>compound selector</a> and a <a>combinator</a>
612
-
to a sequence imposes additional matching constraints,
613
-
so the <a>subjects</a> of a <a>complex selector</a> are always a subset of
614
-
the elements represented by its last <a>compound selector</a>.
615
-
616
-
Issue: Can we make this less wishy-washy by saying that a complex selector “represents” its last compound selector?
617
-
Or do we need to have ''a + b'' “represent” both an "a" and a "b" in a sibling relationship?
623
+
See [[#grouping]] for additional information on <a>selector lists</a>
624
+
and the various <<*-selector-list>> productions in the <a href="#grammar">grammar</a>
625
+
for their formal syntax.
626
+
A given element is said to <a>match</a> a <a>selector list</a>
627
+
when it matches any (at least one) of the <a>selectors</a>
628
+
in that <a>selector list</a>.
618
629
619
630
Issue: Pseudo-elements aren't handled here, and should be.
0 commit comments