jQuery-チェーン
jQueryを使用すると、アクション/メソッドをチェーン化できます。
チェーンを使用すると、1つのステートメント内で(同じ要素に対して)複数のjQueryメソッドを実行できます。
jQueryメソッドチェーン
これまで、jQueryステートメントを一度に1つずつ(次々に)作成してきました。
ただし、チェーンと呼ばれる手法があり、同じ要素で複数のjQueryコマンドを次々に実行できます。
ヒント:このように、ブラウザーは同じ要素を複数回見つける必要はありません。
アクションをチェーンするには、前のアクションにアクションを追加するだけです。
css()
次の例では、、、、slideUp()
およびslideDown()
メソッドをチェーンします。「p1」要素は最初に赤に変わり、次に上にスライドし、次に下にスライドします。
例
$("#p1").css("color", "red").slideUp(2000).slideDown(2000);
必要に応じて、メソッド呼び出しを追加することもできます。
ヒント:チェーンする場合、コードの行がかなり長くなる可能性があります。ただし、jQueryの構文はそれほど厳密ではありません。改行やインデントなど、好きなようにフォーマットできます。
これも問題なく機能します。
例
$("#p1").css("color", "red")
.slideUp(2000)
.slideDown(2000);
jQueryは余分な空白を破棄し、上記の行を1行の長いコードとして実行します。