event-handling - 異なる jQuery イベント バインディング方法

Question

この表記の意味は次のとおりです。

$("#linka").click(function() {

   // some codes

}).fancybox({

   // some options

});

それとこれらのコードの違いは何ですか:

$("#linka").click(function() {

   // some codes

});

$("#linka").fancybox({

   // some options

});

ありがとうございました。

Answer 1

jQueryを使用すると、セレクターを毎回再定義する代わりに、メソッドをチェーンできます。上記の両方のコードサンプルは、まったく同じことを行います。最初のメソッドは、jQuery関数への不要な呼び出しを単に省略します。

Answer 2

最終結果は同じになりますが、2番目のコードスニペットには、要素を再選択するためのjQuery関数への不要な呼び出しがあります。ほとんどのjQueryメソッドは、同じ要素または更新された要素のセットを含むjQueryオブジェクトを返し、後で他のjQueryメソッドを呼び出すことができます。

これはメソッドチェーンと呼ばれ、要素を1回選択して、複数のメソッドを使用してそれらと対話することができます。

Answer 3

どちらの方法でも同じ結果が得られます。チェーン メソッドの概念は、ここではメソッド one.here で適用されます。ここでは、セレクターを再度宣言する必要はありません。

方法 2 では、セレクターを 2 回宣言しています。チェーンメソッドでは、セレクターを何度も宣言しないことのみが許可されます。チェーンメソッドを使用して、必要な数のメソッドをバインドできます。同じセレクターにホバーメソッドが必要だと想像してください。伝統的に、チェーンメソッドを使用して、同じセレクターで 3 つのメソッドを宣言します。

$("#linka").click(function() {

 // method1

}).fancybox({

 // method2

 }).hover(function(){//method3
 },function(){
 });