Prototype.jsやjQueryなどのJavaScriptフレームワークではHTMLのクラス名やIDなどを指定して要素を取得できるようになっている。とは言え、簡単な要素の取得のためにフレームワーク全体を読み込むというのはちょっと面倒だ。

ピクチャ 40.png

次世代版のCSSセレクタエンジン

 

そこでもっと手軽に使えるCSSセレクタとしてSizzleを紹介しよう。jQuery開発者の方が開発している次世代版のCSSセレクタエンジンだ。

今回紹介するオープンソース・ソフトウェアはSizzle、高速&多機能なCSSセレクタエンジンだ。

SizzleではCSS3のサポート、not指定による要素の除外指定、ポジション(最初、最後、偶数、奇数など)指定など多彩な機能が実装されている。単体で用いることもでき、わずか4KBという軽量さだ(難読化+GZip圧縮した場合だが)。

ピクチャ 42.png

Firefox3 for Mac OSXの場合、エラーが多い

 

:inputを使えばフォーム中の全ての入力要素が取得でき、さらに:textや:checkboxなどを使って種類をフィルタリングすることもできる。これまでのものよりも高速化されており、もっとWebアプリケーション開発が便利になるはずだ。

なおテストを実行するとSafari4では2つ、Firefox3ではそれ以上にエラーが起きてしまう。利用する機能をしぼるか、今しばらく待った方が良いかもしれない。

 

via 高速な CSS セレクタエンジン「Sizzle」「Peppy」を試す [WebOS Goodies]

**Sizzle JavaScript Selector Library

 **
http://sizzlejs.com/