Is parent selector available in css4? [closed]

问题:

Here is fiddle and I have 2 divs one is outer box and another is the innerBox, On clicking innerBox I need to change the property of the outer box.

As of css3 its not possible, so is anything available in css4?

回答1:

There may not be such a thing as CSS4, but there is such a thing as "Selectors Level 4". This is an unfinished spec for the next generation of selectors, and does include a parent selector in the spec. Or more accurately, a "subject" selector.

The spec document is here: http://dev.w3.org/csswg/selectors/

But note that it is a dev URL, and the spec is still very much a work-in-progress.

In real code, the subject selector might look like this:

div > !.foo > span

This would select an element with the class foo, that is a child of a div, and has a span within it as a child.

However as I said, this is not a finished spec (indeed, the syntax for the subject selector has changed more than once during the process, and may still be subject to further change at any time). It is also not implemented yet in any of the browsers, and there is no expectation of it being so either any time soon.

In addition, even if/when Selectors Level 4 is implemented in the browsers, the spec explicitly states that some selectors can be left out of the implementation for performance reasons (they differentiate between 'fast' selectors and the 'complete' set of selectors). The subject selector is one of these: If the spec remains as is, then browsers would have no compulsion to add it to CSS. In this case, they would maybe add it to Javascript, ie for methods like document.querySelector() but not to CSS itself. This wouldn't really help you in any way, since it's already possible to find a parent element via javascript anyway. (See section 2.1 in the spec linked above for more on this).

So the short answer is: No, it isn't possible. It may be possible in the future, but that doesn't help you now, and even in the future there may be show-stopping caveats.

(you may also like to read this article which is a more end-user-friendly document than the actual spec. But you'll note that the subject selector syntax has changed since this article was written)

回答2:

As pointed by Liam, there is no CSS4.

Forget about parent selector since it comes with a host of new problems.

There's a reason, why it isn't there.

With parent selectors it becomes extremely easy to accidentally cause a document-wide grovel. People can and will misuse this selector. Supporting it is giving people a whole lot of rope to hang themselves with

And

What I've described is not technically impossible. In fact, quite the opposite. It just means that we'd have to deal with the performance implications of using such a feature.

But you can easily do it with js or even use jquery. Its as simple as calling $('a').parent(); in jquery to get the parents of <a> tag.

Source

Edit:

Heads Up! The Selectors Level 4 are implementing this feature. Thanks TylerH for pointing out this.