2011-06-18 9 views
2

既に変数がある場合は、$a_divのjQueryオブジェクト次のマークアップでDIVと私がPS

<div id="a"> 
    ... 
    <p>...</p> 
    ... 
</div> 

を見つけたいがDIVでP要素を選択するために、これらの方法の間に有意なパフォーマンスの違いはありますか?

$('#a p') 
$('p', $a_div) 
$a_div.find('p') 

もしそうなら、あなたはその理由を知っていますか?

答えて

5

この種のものは通常ブラウザに依存しますが、私は3番目のものを使用します。

最初に、querySelectorAllのブラウザが利用されるため、パフォーマンスは良いはずです。 qsaをサポートしていないブラウザで

、私はシズルは、ページ上のすべてのpの要素を見つけ、#a要素がありますかどうかを確認するために彼らの祖先を横断思います。それはバックグラウンドで三番目に変更されますので、私は、まったく秒1を使用することはありません

$('#a p') 

$('p', $a_div) // becomes $a_div.find('p') 

querySelectorAllまたはgetElementsByTagNameを経由するかどうか、あなたはDOMにおける既知の点から始まり、それだけ内での検索、私は、これは一般的に最速になることを賭けると思います。

+0

非常に有用な背景情報 - ありがとう、パトリック。私は$( '#a p')でショックを受けている。私はそれを好んでいました。なぜなら、以前は素早く素早く読んでいたからです。私は古い格言のカップルを覚えておくべきです:1)あなたがインターネット上で読んだことすべてを信じてはいけません。 2)Doveryai、proveryaはありません。 –

+0

@fsb:どうぞよろしくお願いいたします。 jsPerfへのリビジョンを実行した後、私は完全なセレクタのパフォーマンスにもかなり驚いています。パフォーマンステストをお勧めします全体的に、私の方針は、私がすでに選択したDOM要素の再選択を常に避けることです。 – user113716

2

あなたはいつもそれをテストすることができます - http://jsperf.com/some-jquery-selectors-performance-tests

2つ目は、早く最初の、そして三番目多少の約三度のようです。これは間違いなくあなたのHTML構造の残りの部分によって異なりますが、私は最初のものが常に最も遅く残ることを確信しています。

+2

これは素晴らしいテストツールです。私にそれを紹介してくれてありがとう。私は#a DIVを他のDOMノードがたくさんあるページに置くようにマークアップを修正し、 '$( '#a p')'はかなり遅くなりました。 –

関連する問題