はじめに
ご存じのとおり、John ResigはSizzle （selector [、context]）と呼ばれるまったく新しいセレクターエンジンを作成しました。
jQuery （min / gzip形式で4Kbのみ）とは別に使用することも、一緒に使用することもできます。
優れたパフォーマンスに加えて、優れた拡張性も備えているので、これについて説明します。
疑似セレクター
最も単純なケース：visibility = hiddenプロパティで要素を選択する擬似セレクターを記述します。
この例は、jQueryのSizzleが接続されていることを前提に書かれています。
< script type ="text/javascript" src ="/jslib/jquery.js" ></ script >
<div style= "visibility:hidden;" >test</div>
< script type= "text/javascript" >
( function (Sizzle)
{
Sizzle.selectors.filters[ 'vis-hidden' ] = function (elem)
{
return elem.style.visibility == 'hidden' ;
};
// .
var elts = Sizzle( ':vis-hidden' );
for ( var i = 0; i < elts.length; i++)
{
var elt = elts[i];
elt.innerHTML = 'Caught' ;
elt.style.visibility = '' ;
}
})(jQuery.find);
</ script >
* This source code was highlighted with Source Code Highlighter .
jQueryで使用する
シズルセレクターはjQueryで自然に機能します。
< script src ="/jslib/jquery.js" ></ script >
<div style= "visibility:hidden;" >test</div>
<script>
( function ($)
{
var Sizzle = $.find;
Sizzle.selectors.filters[ 'vis-hidden' ] = function (elem)
{
return elem.style.visibility == 'hidden' ;
};
$( ':vis-hidden' ).html( 'Caught' ).css( 'visibility' , '' );
})(jQuery);
</ script >
* This source code was highlighted with Source Code Highlighter .
セレクターとフィルター
他のセレクターおよびフィルターオプションの作成はもう少し複雑です。