• チュートリアル
• ダイジェスト
• リファレンス
• デモ
• テスト
• 構築キット
• with Gadgets
• with jQuery
• with Microformats
• よくある質問
• お問い合わせ
• 利用規約
• フォーラム
• ブログ

Prototype $$ メソッドを jQuery Selector で置き換えてみる

prototype.js の開発者向けメモ $$() 関数を使う の中で、次のとおり、使い方によってはパフォーマンスに影響するので $$ 関数の置き換えを検討してはどうかとあります。

パフォーマンスについてちょっと記しておきます。 prototype.js の $$() 関数の現在の実装では、特に効率的な実装を重視しているわけではありません。この関数を頻繁に使って、深く複雑な HTML 文書を処理しようとしているのなら、単純に $$() 関数自体を置き換えることができる、他のフリーの実装を検討した方がいいかもしれません。

$$() 関数の CSS Selector と似たものといえば jQuery が思いつくので、次のとおり $$() 関数を jQuery の Selector の実装で置き換えてみました。

<script type="text/javascript">
//<![CDATA[
function $$() {
  var elements = [];
  $A(arguments).each(function(expr) {
    elements = elements.concat($A(jQuery(expr)));
  });
  return elements.map(function(element) {
    return Element.extend(element);
  });
}
//]]>
</script>

$$() 関数の引数 (Selector 記述) を jQuery で繰り返し、その選択した要素の配列を返します。このとき Element.extend を使って要素を拡張しています。

Prototype と jQuery は相性(衝突)の問題がありますが、jQuery は 利用者の判断で回避できるような仕組み を提供しています。

関連情報