2009-08-04 6 views
1

id選択のさまざまな実装を持つ多数のjQuery関数を検討しています。ベストプラクティスの1つのアプローチで標準化しようと思いますが、それを行う前に、私が最も効率的なものを選ぶようにしたいと思います。jQueryセレクターの比較記事

誰かが良い記事へのリンクを持っていますか(this oneなど)、jQueryのさまざまなタイプの選択を比較できますか?

具体的には、$("#id"),$("#id[type=form_input_type]")$("#id .class")などの比較の後です。

実際には、さらに具体的には、私の最初の優先順位が比較されます。

$('input:checkbox') 

に対する

$('input[id$="mySelectionID"]') 

を、どちらもチェックボックスの同じセットを返します。私の直感は、2番目が速いということですが、私は確信が必要です。

+1

最良の方法は、それをテストすることです。プロファイラとconsole.profile( 'test1')とconsole.profileEnd()を使用してFirefoxとFirebugを簡単に切り替えます。 – redsquare

+0

また$( 'input [id $ = "mySelectionID"]')と$( 'input:checkbox ')は、その値で終わるチェックボックスのみを持つ場合にのみ、同じセットを返します。 – redsquare

+0

チェックボックスには、その値で終わるIDがあります。それらはすべて同じ命名規則に従います。 –

答えて

1

$("#id"), $("#id[type=form_input_type]"), $("#id .class") 

要素のidはあなたがid selectorを使用している場合、それは単一の要素にマッチするので、あなたは、任意のより多くの指定する必要はありません、一意である必要があります指定されたid属性を持つ

は、jQueryのセレクタのパフォーマンスについては、この記事をチェックしてください:

+0

優秀!私はその記事をしばらく前に見つけたが、どこを覚えておらず、それを再び見つけることができなかった。ありがとう。 –

+1

記事の結果は古くなっています(古いブラウザのバージョン、古いjQueryのバージョン)。最新のjQueryを使用した同じ一連のテスト - http://jsbin.com/udaka –

0

IDを選択するには、document.getElementById()を直接呼び出しているため、$("#id")が常に最も効率的になります。他のものは、jQueryの部分(クラス選択など)にもっと多くの作業を必要とします。

+0

ええ、実際に私はおそらくそれを言及すべきではありません。 IDは常に最速です - 私が主に興味を持っている他の人との比較です。(クラスで選択するなど)遅いことがありますが、それほど明白でないものは私が本当に後にしているものです。 –

1

Slickspeedは、複数のjsライブラリにまたがるセレクタのさまざまな性能値を提供します。

ThisさまざまなjQueryバージョンを比較するだけです。

Mr Resigにはセレクタに関する興味深いポストhereがあります。

あなたはIDセレクタを使用して、あなたの例では