[解決済み] Jquery live()とdelegate()の比較 [重複] [重複
質問
との違いについて、ここやウェブ上の他の場所でいくつかの投稿を読みました。
live()
と
delegate()
. しかし、私は探している答えを見つけることができませんでした(これが重複している場合は教えてください)。
の違いがあることは知っています。
live
と
delegate
は、その
live
をチェーンで使用することができないということです。また、どこかで読んだのですが
delegate
の方が速い(パフォーマンスが良い)場合があるとも書いてありました。
私の質問は、あなたが
live
の代わりに
delegate
?
アップデイト
を設定したのですが 簡易テスト を設定して、パフォーマンスの違いを見てみます。
また、新しい
.on()
を追加しました。これは jQuery 1.7+ で利用可能です。
この結果は、回答で述べられているように、パフォーマンスの問題をかなり要約しています。
-
を使用しないでください。
.live()
を使わないでください。.delegate()
. -
を使用しないでください。
.delegate()
を使わないでください。.on()
.
との違いは
.live()
と
.delegate()
の間よりずっと大きいです。
delegate()
と
.on()
.
どのように解決するのですか?
私は
live
を使うことの利点を考えています。
delegate
を使用することの利点は、圧倒的に大きいと考えています。
の一つの利点は
live
の構文に非常に近いということです。
bind
:
$('a.myClass').live('click', function() { ... });
delegate
のように、少し冗長な構文が使われます。
$('#containerElement').delegate('a.myClass', 'click', function() { ... });
しかし、この方が実際に起こっていることをより明確に表現しているように思えます。 あなたは
live
の例では、イベントが実際に捕捉されるのは
document
であり
delegate
であることから、イベントキャプチャは
#containerElement
. 同じことを
live
でも同じことができますが、構文がどんどんひどくなっていきます。
イベントをキャプチャするためのコンテキストを指定することで、パフォーマンスも向上します。 このため
live
の例では、ドキュメント全体をクリックするたびに、セレクタの
a.myClass
と比較しなければなりません。 とは
delegate
の中にある要素だけです。
#containerElement
. これは明らかにパフォーマンスを向上させます。
最後に
live
は、ブラウザが
a.myClass
現在存在するかどうか
.
delegate
はイベントが発生したときだけ要素を探すので、さらなるパフォーマンス上の利点があります。
NB
delegate
用途
live
を裏で使っているので
live
でできることは
delegate
. 私の答えは、それらが一般的に使用されているように、それらを扱っています。
また、どちらも
live
でも
delegate
は、最新のjQueryでイベントデリゲーションを行うための最良の方法です。新しい構文(jQuery 1.7時点)では、イベント委譲のために
on
関数です。構文は以下の通りです。
$('#containerElement').on('click', 'a.myClass', function() { ... });
関連
-
[解決済み] jquery - is not a function エラー
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] jQueryでチェックボックスに "checked "を設定する
-
[解決済み] jQueryの「exists」関数はありますか?
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] jQueryでテーブルの行を追加する
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
-
[解決済み】jQueryで入力不可属性をトグルする。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] jQueryです。簡単なオーバーレイを作成するにはどうすればよいですか?
-
[解決済み] JavaScript - 二重引用符のエスケープ
-
[解決済み] jQueryのSELECT要素で特定のオプションを選択するにはどうすればよいですか?
-
[解決済み] Google Maps APIでマウスのスクロールホイールによる拡大縮小を無効にする方法
-
[解決済み] ドロップダウンのアイテムの選択値をjQueryで取得する
-
[解決済み] jQueryは要素のレンダリングされた高さを取得しますか?
-
[解決済み] jQueryでフォームフィールドをクリアする
-
[解決済み] jQueryで、ある要素を他の要素に対して相対的に配置するには?
-
[解決済み] jQueryで多段式フォームをリセットする
-
[解決済み] jQuery append() - 追記された要素を返す