[Effect] JQ - Chaining 기법 ★ - 여러 메서드 연쇄 실행. (= 메서드 이어서 실행시키기. = 체이닝)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

 

<script>

$(document).ready(function(){

    $("button").click(function(){

        $("#site")

          .css("color", "red")
          .animate ({fontSize:"1.5em"})

          .slideUp(2000)

          .slideDown(2000);

    });

});

</script>

<p id="site">홈짱닷컴 (Homzzang.com)</p>

<button>움직여라! 짠.</button>

결과보기

※ 2가지 모두 가능.

 

메서드를 옆으로 나열.

$("selector").method(option).method(option).method(option);

메서드를 밑으로 나열.
$("selector")
    .method(option)
    .method(option)
    .method(option);