2011-06-08 11 views
7

CSS(任意のバージョン)には、jQueryの:has()セレクタのようなものがありますか?CSSにはjQueryの:has()のようなものがありますか?

jQuery(':has(selector)')

説明:は には、指定されたセレクタと一致していること少なくとも一つの要素を含む要素を選択します。

http://api.jquery.com/has-selector/

+0

has()セレクタで何を求めていますか? – mightyplow

+0

これは通常の子セレクタではありませんか?セレクタ内のルールは、一致するすべての要素に適用されます。 – andyb

+1

@andyb: ':has()'は ':not()'と似た条件付き疑似クラスです。一致する要素は、括弧ではなく、疑似クラスの周りのセレクタです。 – BoltClock

答えて

6

いいえ、ありません。 CSSの設計方法は、祖先や先行する兄弟と一致するセレクタを許可しません。 (および>)、後続の兄弟(~および+)または特定の子(:*-child)です。祖先セレクタは:root疑似クラスで、ドキュメントのルート要素を選択します(HTMLページでは当然htmlとなります)。

:has()で照会している要素にスタイルを適用する必要がある場合は、そのクラスにCSSクラスを追加して、そのクラスでスタイルを設定する必要があります(as suggested by Stargazer712)。これを実現する最良の方法は、jQueryのを使用することです

+1

セレクタ4のドラフトは、jQueryの ':has()'セレクタとは異なるセマンティクスを持っているが、標準化され、実装されます。 – BoltClock

5

番号:

CSSファイル:

.myAwesomeClass { 
    ... 
} 

JSファイル:

selectorが、それはあなたが最初にあったあるものは何でもある
jQuery(':has(selector)').addClass("myAwesomeClass") 

一致しようとしています。

+2

*最良の方法は、CSSが時々少しでも痛みがあっても、JavaScriptに頼る必要がないように、CSSとマークアップを整理することです。 –