javascript - セレクターエンジンとは？

Question

John Resig の Sizzle という名前の高速な新しいセレクター エンジンのニュースをかなりの場所で見てきましたが、セレクター エンジンが何であるかはわかりませんし、それが何であるかを説明している記事もありません。Resig が jQuery の作成者であり、Sizzle が Javascript の何かであることは知っていますが、それ以上のことはわかりません。セレクターエンジンとは？

ありがとう！

Answer 1

ある種のクエリ (通常は CSS 構文など) に基づいて、特定の要素についてページの DOM をクエリするために、セレクター エンジンが使用されます。

たとえば、次の jQuery は次のようになります。

$('div')

ページ上のすべての <div> 要素を検索して返します。これを行うには、jQuery のセレクター エンジンを使用します。

これらのフレームワークで実行するほとんどすべての操作は、ある種の DOM クエリに基づいているため、セレクター エンジンの最適化は重要です。

Answer 2

セレクター エンジンは、特定の文字列を使用して DOM ツリー内の要素を選択できるようにする JavaScript ライブラリです (DOM 要素の正規表現を考えてください)。ほとんどのセレクター エンジンは、CSS3 セレクター構文のいくつかのバリエーションを使用するため、たとえば、次のように記述できます。

var paragraphs = selectorengine.select('p.firstParagraph')

クラス firstParagraph を持つドキュメント内のすべての P 要素を選択します。

一部のセレクター エンジンは、XPath の部分的な実装や、一部のカスタム構文もサポートしています。たとえば、jQuery では次のように記述できます。

var checkedBoxes = jQuery('form#login input:checked')

ドキュメントのログイン フォームでチェックされているすべてのチェック ボックスをオンにします。

Answer 3

セレクター エンジンは、特定の要素を探して DOM を横断する方法です。

組み込みのセレクター エンジンの例:

var foo = document.getElementById('foo');

Answer 4

また、Sizzle は、John Resig が現在取り組んでいるエンジンであり、jQuery のすでに素晴らしいセレクター エンジンを置き換えるものです。