/ / jQueryでは、イベントハンドラをバインドする前に要素が存在するかどうかを確認する方が早いでしょうか? - javascript、jquery、performance

jQueryでは、イベントハンドラをバインドする前に要素が存在するかどうかを確認する方が速いのですか? - javascript、jquery、performance

最初に要素が存在するかどうかをチェックし、次にイベントハンドラをバインドする方が速いですか?

if( $(".selector").length ) {
$(".selector").on("click",function() {
// Do stuff on click
}
}

または単にそれを行う方が良いですか?

$(".selector").on("click",function() {
// Do stuff on click
}

すべてこれはドキュメントの準備ができているので、遅延が少なくなるほど良い結果が得られます。

回答:

回答№1は4

ちょうど使用する

$(".selector").on("click",function() {
// Do stuff on click
}

クラスに要素が存在しない場合 selectorjQueryは単に何もバインドしません。


回答№2の11

ifチェックを書くより良い方法は次のようなものです

var elems = $(".selector");
if( elems.length ) {
elems.on("click",function() {
// Do stuff on click
});
}

だから私たちはこれをテストし、コードが教えてくれるものを見てみましょう http://jsperf.com/speed-when-no-matches

要素のないパフォーマンスの表示

最後に、あなたはミリ秒の話です1回実行した場合には、ノン・チェックが顕著になることはありません。これはまた、見つかる要素がある場合に考慮に入れない。その場合には、余分なifチェックがある。その点検の問題

だから要素を見つけたら見てみましょう http://jsperf.com/speed-when-has-matches

実際に違いはありません。したがって、ミリ秒単位で保存する場合はifを実行します。よりコンパクトなコードが必要な場合は、jQueryのままにしておきます。結局同じことをします。

要素のパフォーマンスを表示する


回答№3の場合は1

$(".selector").on("click",function() { // Do stuff on click } 要素が存在しない場合はバインドします。これはより速いです。


回答№4の場合は0

バインディングは直接使用してください。

$("selector").on("click",function() {
// Do stuff on click
}

指定された要素がない場合セレクタ、それは何もしませんでした - エラーを投稿することさえない、それは要素の実際のチェックが同じことを2回していることを意味します私はそれを要素の存在の正確なチェックと呼んでいませんでしたこれはjQueryで実装されているので、確実にそのように動作します。