2

サーバーへのajax呼び出しを使用して構築されたいくつかのページを扱っているので、.on()イベントハンドラーを新しいアイテムにアタッチすることに依存しています。

ただし、可能であれば、javascript:function()イベントハンドラーがである場合は常に、古い関数に依存して関数を呼び出す方が効率的かどうか疑問に思いましたclick。

これが例です。

サーバーからリンク要素を取得しますa：

<a href="javascript:doMoreStuff()" class="classThatDoesMore">Do More!</a>

そして私はそれを次のようにドキュメントに挿入します：

// ajax call and so
$(this).html(response);

「もっとやる」には、2つの方法があります（他の方法もあるかもしれませんが、私はそれらに気づいていませんが、どんな提案も歓迎します！）：

$(document).on("click",".clssThatDoesMore",function(){ // I need (document)
     // here something will be done
});

また

doMoreStuff(){
    // here something will be done as well
}

私の知る限り、両方のソリューションはほとんどクロスブラウザーです（テスト済みhref="javascript:function()"で、少なくともIE8に戻ります）が、間違っている場合はお知らせください。

過剰な.on()「リスナー」がブラウザに大きな負荷をかける可能性があるのではないかと思っていたので、頼るほうがよいjavascript:function()のか、それとも逆に、.on()リソースをまったく必要とせず.on()、ページに複数のリスナーがいるのか、問題はありません。

PS onclick="doMoreStuff()"Safariでは機能していなかったので放棄しましたが、FFではまったく同じコードが機能していたので、eを使用して実行した場合はSafariでも機能していましhref="javascript:doMoreStuff()た。

PPSこれは同じ古い質問jsv。jqueryではありません。私にとって重要なのは、一般的にどちらがより効率的かということではありません。この特定のタスクを達成するための最良の方法を理解したいと思います:-)

4

2 に答える 2

6

javascript:doMoreStuff()悪くはないにしても、同じくらい悪いですonclick="doMoreStuff()"。柔軟性がなく、JSが有効になっていない場合はフォールバックがなくjavascript:、私が理解しているように、疑似プロトコルは準拠していません。

効率を忘れて、.onはるかにクリーンであるという事実に焦点を当てましょう。html / ajaxから分離することができ、何をしているかを確認して後で変更するのは非常に簡単です。

効率に関しては、違いに気付かないと思います。 .onクリックイベントがDOMツリーを少しトラバースして、イベントが発生するかどうかを判断する必要があるという点で、効率はわずかに低くなりますが、これは非常に小さなジャガイモです。

于 2013-01-22T16:41:39.113 に答える
1

ドキュメントツリーの最上位近くに多くの委任されたイベントハンドラーをアタッチすると、パフォーマンスが低下する可能性があります。イベントが発生するたびに、jQueryは、そのタイプのすべてのアタッチされたイベントのすべてのセレクターを、イベントターゲットからドキュメントの先頭までのパス内のすべての要素と比較する必要があります。最高のパフォーマンスを得るには、ターゲット要素にできるだけ近いドキュメントの場所に委任されたイベントを添付します。大きなドキュメントの委任されたイベントにdocumentまたはdocument.bodyを過度に使用することは避けてください。

http://api.jquery.com/on/#event-performanceから

2セントを追加するだけで、コールバック関数の数ではなく、パフォーマンスに焦点を当てます。メモリは安価であり、イベントハンドラー（100）の数に達しない限り、それらの数に基づくパフォーマンスへの影響は見られません。

于 2013-01-22T17:09:47.833 に答える