このjQueryの使用はページの表示時間を遅くしますか？

onclickハンドラーをHTMLに組み込む方が効率的ですか？（xQueryを使用して）document.onreadyイベントが発生した後にハンドラーを接続しているページに約300以上のアクションリンクがあります。 DOM要素が作成された後にjQueryを添付しますか？

<a onclick="... do stuff ...">

ページ上の300個のアクション...好奇心の外に、このページは何をしていますか？ – Hollister

ページ上で最大50個のアイテム*アイテムごとに6個のアクションが可能... –

遅くなりますか？はいバインディングには時間がかかります。何度でもかかります。時間です。しかし、実際にあなたの状況を改善するいくつかの方法があります。

それはここ.live()または.delegate()ハンドラを使用するために、実際より良いですので、あなたの最初の結合コストはこのように、かなり少ない：

$('a.cmd').live('click', function() { /* do stuff */ });

またはそれ以上：の両方で

$(document.body).delegate('a.cmd', 'click', function() { /* do stuff */ });

これらのケースでは、各DOM要素にハンドブックを添付する代わりに、を添付します。の1つイベントハンドラをdocument（または2番目の例の場合は<body>）に変更します。これは、ページの開始コストが大幅に少なくなることを意味します。

2010-12-07 14:35:49

なぜdelegate（）がdocument.bodyの方が優れているのですか？ –

@Matt - 必要になるまで 'a.cmd'セレクタを実行しないので、' .live（） 'で要素のセットを取り出して投げ捨てるだけです。 –

さて、十分に公正。なぜなら、何がマイクロ最適化なのでしょうか... –

インラインイベントハンドラは間違いなくより効率的ではありませんそれ自体はです。両方のメソッドは、多数のリスナーを作成します。

効率的な方法は、.live()または.delegate()です。

$('a.cmd').live('click', function() { /* do stuff */ });

すでにjQueryのを使用している場合は、イベントハンドラが結合（HTMLで）インラインを使用するには、説得力のある理由はほとんどありません。

2010-12-07 14:36:42

答えて