CSS セレクターテスター

使い方

1. 最初のボックスに HTML を貼り付けます。
2. CSS セレクターを入力します(例: li.item や a[href^="https"])。
3. マッチ数と各マッチ要素を確認し、必要ならコピーします。

よくある質問

どのセレクターに対応していますか?

結合子、属性セレクター、:not()、:nth-child() など、querySelectorAll でブラウザがサポートするすべてのセレクターに対応します。::before のような擬似要素は DOM と同様に何にもマッチしません。

結果は正確ですか?

はい。HTML を実際のドキュメントとして解析し、ブラウザのネイティブセレクターエンジンでクエリするため、そのマークアップで querySelectorAll が返すものと正確に一致します。

セレクターが無効な場合は?

誤解を招く結果を返す代わりに、セレクター欄が強調表示され、エラーメッセージが表示されます。

私の HTML はどこかに送信されますか?

いいえ。解析とマッチングは完全にブラウザ内で行われ、何もアップロードされません。

関連ツール