CODEWITHSUNDEEP
htmlcsscss-selectorsparent-childpseudo-class
iBug
iBug

Reputation: 37327

What does it mean for an element to not have a parent?

I'm reading the MDN documentation for :only-child pseudo-class, and there's one confusing point:

Note: As originally defined, the selected element had to have a parent. Beginning with Selectors Level 4, this is no longer required.

The Specifications section also lists Selectors Level 4 with a comment "Matching elements are not required to have a parent."

I'm scratching my head against the "element does not have a parent" description. Does it mean the <html> element or something like what the :root selector would match?

Upvotes: 4

Views: 584

Answers (1)

BoltClock
BoltClock

Reputation: 724592

Does it mean the <html> element or something like what the :root selector would match?

Yep. The root element does not have a parent. Previously, this would make it not match any of the *-child pseudos, but as of Selectors 4, it's no longer excluded. But more importantly, this now also includes top-level shadow tree elements, which don't have an element parent and therefore were previously excluded as well. With this restriction removed, you can now select specific top-level shadow tree elements using those pseudos.

See Emilio's and Tab's replies to my www-style thread here from a few years ago.

Upvotes: 1

Related Questions