2012-01-25 7 views
4

Seleniumで使用するCSSセレクタを開発しようとしています。特に、擬似クラス:contains()を使用したいと思います。 W3には:contains()を付けたCSS3のドラフトがありますが、最終版には含まれていないようです。ブラウザでcontains:)CSS3疑似クラスをテストするために使用できるツールはどれですか?

私は自分のCSSセレクタをチェックして正しいことを確認するためにChromeのツールを使用しています。 Chromeは実装されていないようです:contains()。わかります。

私のウェブページにcontains()を使用するセレクタを試すことができるツールはありますか?

私はLionを搭載したMacを使用しています。私はまた、Firefox 3.5.7を使用することに潜在的に制限されています(私は今更新を延期するよう言われました)。

+0

何最終バージョンは? CSS3のモジュールは今でもほとんどのドラフトです。 –

+0

@ŠimeVidas:はい、ほとんどですが、Selectorsモジュールは昨年9月にW3C勧告に卒業しました。それは今でも非常にクールなURLを持っています:http://www.w3.org/TR/selectors – BoltClock

+0

@BoltClockああ私が参照してください。セレクタが推奨に達しました。ニースURL ':)' –

答えて

8

jQueryのセレクタエンジンも:contains()疑似クラスを実装します。 It is to my knowledge jQueryとSeleniumは同じ方法で実装しています。

jQueryを使用していないサイトでどのようにテストできるかわかりませんが、サイトではブラウザのJavaScriptコンソールを起動してjQueryセレクタを実行するだけですコンソールで

はここでChromeのJavaScriptコンソールにこの非常にスタックオーバーフローの質問を見ると例を示します(あなたがログインしたりしていないかどうかに応じて異なる結果を得ることができます):

> $("#mainbar div[id]:contains('selector')").get() /* DOM objects with .get() */ 
[<div class=​"question" id=​"question">​…​</div>​, <div id=​"answers">​…​</div>​, <div id=​"answer-9007154" class=​"answer">​…​</div>, <div id=​"answer-9008184" class=​"answer">​…​</div>​] 
+1

Sizzle(jquery)やSlick(mootools)のような多くのセレクタエンジンは ':contains'セレクタを実装しています。 – c69

+0

恐ろしい!それはトリックを行います。ありがとう。 – Huliax

1

私は:contains()セレクターがどこにも見当たらず、自分でそれを見たことがありません。

ノー疑似クラスは、起動します:http://caniuse.com/#search=contain

+0

セレンには確かに存在します。私はそれを使用する私の前で作業コードを持っています。ここを参照してください[ソースラボのブログ](http://saucelabs.com/blog/index.php/2010/01/selenium-totw-css-selectors-in-selenium-demystified/) – Huliax

+1

Huliaxは正しいです; ':contains()'は、2001年にはじめて提案されたが、2005年に落とされた古いCSS3の擬似クラスでした。これはまだとにかくSeleniumに実装されています。私の答えを見てください。 – BoltClock

+0

@BoltClockの説明をありがとう!私は年上で賢明です:) –

関連する問題