Skip to content

Commit 7dbef0f

Browse files
committed
[selectors-4] Rename :matches() to :is() per WG resolution. w3c#3258
1 parent 0d298cb commit 7dbef0f

File tree

1 file changed

+33
-26
lines changed

1 file changed

+33
-26
lines changed

selectors-4/Overview.bs

Lines changed: 33 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ Selectors Overview</h2>
133133
<td>[[#negation]]
134134
<td>3/4
135135
<tr>
136-
<td><code>E:matches(<var>s1</var>, <var>s2</var>, &hellip;)</code>
136+
<td><code>E:is(<var>s1</var>, <var>s2</var>, &hellip;)</code>
137137
<td>an E element that matches <a>compound selector</a> <var>s1</var>
138138
and/or <a>compound selector</a> <var>s2</var>
139139
<td>[[#matches]]
@@ -913,7 +913,7 @@ Pseudo-classing Pseudo-elements</h4>
913913
unless otherwise-specified, none of these <a>pseudo-classes</a>
914914
will match on the <a>pseudo-element</a>.
915915

916-
Issue: Clarify that '':not()'' and '':matches()'' can be used when containing above-mentioned pseudos.
916+
Issue: Clarify that '':not()'' and '':is()'' can be used when containing above-mentioned pseudos.
917917

918918
<div class="example">
919919
For example, since the '':hover'' pseudo-class specifies
@@ -1108,31 +1108,31 @@ Selector Lists</h3>
11081108
</div>
11091109

11101110
<h3 id="matches">
1111-
The Matches-any Pseudo-class: '':matches()''</h3>
1111+
The Matches-Any Pseudo-class: '':is()''</h3>
11121112

1113-
The matches-any pseudo-class, <dfn id='matches-pseudo'>:matches()</dfn>,
1113+
The matches-any pseudo-class, <dfn id='matches-pseudo'>:is()</dfn>,
11141114
is a functional pseudo-class taking a <a>selector list</a> as its argument.
11151115
It represents an element that is represented by its argument.
11161116

1117-
Note: The specificity of the '':matches()'' pseudo-class
1117+
Note: The specificity of the '':is()'' pseudo-class
11181118
is replaced by the specificity of its most specific argument.
1119-
Thus, a selector written with '':matches()''
1119+
Thus, a selector written with '':is()''
11201120
does not necessarily have equivalent specificity
1121-
to the equivalent selector written without '':matches()''
1121+
to the equivalent selector written without '':is()''
11221122
For example, if we have
1123-
'':matches(ul, ol, .list) > [hidden]'' and ''ul > [hidden], ol > [hidden], .list > [hidden]''
1123+
'':is(ul, ol, .list) > [hidden]'' and ''ul > [hidden], ol > [hidden], .list > [hidden]''
11241124
a ''[hidden]]'' child of an <{ol}> matches the first selector
11251125
with a specificity of (0,2,0)
11261126
whereas it matches the second selector
11271127
with a specificity of (0,1,1).
11281128
See [[#specificity-rules]].
11291129

11301130
Pseudo-elements cannot be represented by the matches-any pseudo-class;
1131-
they are not valid within '':matches()''.
1131+
they are not valid within '':is()''.
11321132

11331133
Default namespace declarations do not affect the <a>compound selector</a>
11341134
representing the <a>subject</a> of any selector
1135-
within a '':matches()'' pseudo-class,
1135+
within a '':is()'' pseudo-class,
11361136
unless that compound selector contains
11371137
an explicit <a>universal selector</a> or <a>type selector</a>.
11381138

@@ -1142,18 +1142,23 @@ The Matches-any Pseudo-class: '':matches()''</h3>
11421142
is not limited to only matching elements in the default namespace
11431143
that are being hovered or focused.
11441144

1145-
<pre>*|*:matches(:hover, :focus) </pre>
1145+
<pre>*|*:is(:hover, :focus) </pre>
11461146

11471147
The following selector, however, represents only hovered or focused
11481148
elements that are in the default namespace, because it uses an explicit
1149-
universal selector within the '':matches()'' notation:
1149+
universal selector within the '':is()'' notation:
11501150

1151-
<pre>*|*:matches(*:hover, *:focus) </pre>
1151+
<pre>*|*:is(*:hover, *:focus) </pre>
11521152
</div>
11531153

1154+
As previous drafts of this specification
1155+
used the name <dfn>:matches()</dfn> for this pseudo-class,
1156+
UAs may additionally implement this obsolete name
1157+
as an alias for '':is()''
1158+
if needed for backwards-compatibility.
11541159

11551160
<h3 id="negation">
1156-
The Negation Pseudo-class: '':not()''</h3>
1161+
The Negation (Matches-None) Pseudo-class: '':not()''</h3>
11571162

11581163
The negation pseudo-class, <dfn id='negation-pseudo'>:not()</dfn>,
11591164
is a functional pseudo-class taking a <a>selector list</a> as an argument.
@@ -1164,7 +1169,7 @@ The Negation Pseudo-class: '':not()''</h3>
11641169

11651170
Note: The specificity of the '':not()'' pseudo-class
11661171
is replaced by the specificity of the most specific selector in its argument;
1167-
thus it has the exact behavior of '':not(:matches(<var>argument</var>))''.
1172+
thus it has the exact behavior of '':not(:is(<var>argument</var>))''.
11681173
See [[#specificity-rules]].
11691174

11701175
Pseudo-elements cannot be represented by the negation pseudo-class;
@@ -1186,13 +1191,13 @@ The Negation Pseudo-class: '':not()''</h3>
11861191
<pre>html|*:not(:link):not(:visited)</pre>
11871192
</div>
11881193

1189-
As with '':matches()'',
1194+
As with '':is()'',
11901195
default namespace declarations do not affect the <a>compound selector</a>
11911196
representing the <a>subject</a> of any selector
11921197
within a '':not()'' pseudo-class,
11931198
unless that compound selector contains
11941199
an explicit <a>universal selector</a> or <a>type selector</a>.
1195-
(See '':matches()'' for examples.)
1200+
(See '':is()'' for examples.)
11961201

11971202
Note: The '':not()'' pseudo-class allows useless selectors to be written.
11981203
For instance '':not(*|*)'', which represents no element at all,
@@ -1204,8 +1209,8 @@ The Specificity-adjustment Pseudo-class: '':where()''</h3>
12041209

12051210
The Specificity-adjustment pseudo-class, <dfn id="where-pseudo">:where()</dfn>,
12061211
is a functional pseudo-class
1207-
with the same syntax and functionality as '':matches()''.
1208-
Unlike '':matches()'', neither the '':where'' pseudo-class, nor any of its arguments
1212+
with the same syntax and functionality as '':is()''.
1213+
Unlike '':is()'', neither the '':where'' pseudo-class, nor any of its arguments
12091214
contribute to the specificity of the selector--
12101215
its specificity is always zero.
12111216

@@ -1982,7 +1987,7 @@ The Hyperlink Pseudo-class: '':any-link''</h3>
19821987
For example, in [[HTML5]], any <a element>a</a>, <a element>area</a>, or <a element>link</a> elements with an <code>href</code> attribute
19831988
are hyperlinks, and thus match <code>:any-link</code>.
19841989
It matches an element if the element would match either '':link'' or '':visited'',
1985-
and is equivalent to '':matches(:link, :visited)''.
1990+
and is equivalent to '':is(:link, :visited)''.
19861991

19871992

19881993
<h3 id="link">
@@ -2407,7 +2412,7 @@ The Current-element Pseudo-class: '':current''</h3>
24072412
The <dfn id='current-pseudo'>:current</dfn> pseudo-class represents the
24082413
element, or an ancestor of the element, that is currently being displayed.
24092414

2410-
Its alternate form <dfn>:current()</dfn>, like '':matches()'',
2415+
Its alternate form <dfn>:current()</dfn>, like '':is()'',
24112416
takes a list of <a>compound selectors</a> as its argument: it represents the
24122417
'':current'' element that matches the argument or, if that does
24132418
not match, the innermost ancestor of the '':current'' element
@@ -3314,7 +3319,7 @@ Calculating a selector's specificity</h2>
33143319

33153320
<ul>
33163321
<li>
3317-
The specificity of a '':matches'', '':not()'', or '':has()'' pseudo-class
3322+
The specificity of a '':is'', '':not()'', or '':has()'' pseudo-class
33183323
is replaced by the specificity of
33193324
the most specific complex selector in its selector list argument.
33203325
<li>
@@ -3330,7 +3335,7 @@ Calculating a selector's specificity</h2>
33303335
For example:
33313336
<ul>
33323337
<li>
3333-
'':matches(em, #foo)'' has
3338+
'':is(em, #foo)'' has
33343339
a specificity of (1,0,0)--
33353340
like an ID selector--
33363341
when matched against any of
@@ -3379,7 +3384,7 @@ Calculating a selector's specificity</h2>
33793384
LI.red.level /* a=0 b=2 c=1 */
33803385
#x34y /* a=1 b=0 c=0 */
33813386
#s12:not(FOO) /* a=1 b=0 c=1 */
3382-
.foo :matches(.bar, #baz)
3387+
.foo :is(.bar, #baz)
33833388
/* a=1 b=1 c=0 */
33843389
</pre>
33853390
</div>
@@ -3792,7 +3797,7 @@ Appendix A: Guidance on Mapping Source Documents &amp; Data to an Element Tree</
37923797
that must be explicitly defined.
37933798

37943799
Issue: Some pseudo-classes are *syntactical*,
3795-
like '':has()'' and '':matches()'',
3800+
like '':has()'' and '':is()'',
37963801
and thus should always work.
37973802
Need to indicate that somewhere.
37983803
Probably the structural pseudos always work
@@ -3914,9 +3919,11 @@ Changes</h2>
39143919
<ul>
39153920
<li>Named the zero-specificity selector to '':where()''.
39163921
(<a href="https://github.com/w3c/csswg-drafts/issues/2143">Issue 2143</a>)
3922+
<li>Renamed '':matches()'' to '':is()''.
3923+
(<a href="https://github.com/w3c/csswg-drafts/issues/3258">Issue 3258</a>)
39173924
<li>Removed '':blank'' and defined '':empty'' to ignored white-space&ndash;only nodes.
39183925
(<a href="https://github.com/w3c/csswg-drafts/issues/1967">Issue 1967</a>)
3919-
<li>Changed the specificity of '':matches()'', '':where()'', and '':nth-child()''
3926+
<li>Changed the specificity of '':is()'', '':where()'', and '':nth-child()''
39203927
to not depend on which selector argument matched.
39213928
(<a href="https://github.com/w3c/csswg-drafts/issues/1027">Issue 1027</a>)
39223929
</ul>

0 commit comments

Comments
 (0)