jQuery w3schools 한글판 강좌42 - Chaining

jQuery w3schools 한글판 강좌42 - Chaining > 개발자팁

개발자팁

개발과 관련된 유용한 정보를 공유하세요.
질문은 QA에서 해주시기 바랍니다.

jQuery w3schools 한글판 강좌42 - Chaining 정보

jQuery jQuery w3schools 한글판 강좌42 - Chaining

jQuery w3schools 한글판 강좌42 - 연달아 실행(chaining)

jQuery로 , 액션/동작을 서로 연이어 실행시킬수 있습니다.

연달아실행시킴(chaining) 을 이용하면 여러 jQuery메소드를 (같은 요소에 대해) 한개의 명령어(statement)로 실행할 수 있습니다.

지금까지 우리는 jquery 명령어를(statement) 한번에 한번씩(또는 차례로) 적어왔습니다.

그러나, 체이닝이라 불리는 기술이 있는데, 그것을 이용하면 같은 한개의 요소 또는 같은 여러개의 요소들에 대하여 교대로, 여러 jQuery명령어를 실행할수 있습니다.

팁:이 방식으로 브라우저는 같은 요소 또는 요소들을 여러번 찾을 필요가 없습니다.

동작(action)을 연이어 실행시키려면, 단순히 동작(action)을 이전 동작에 붙이기만 하면 됩니다.

다음 예는 css(), slideUp()그리고 slideDown()메소드를 체이닝합니다.

"p1"요소는 맨 처음 적색으로 바뀌고, 그 다음에 위로 슬라이드되며, 그리고 나서 아래로 슬라이드 됩니다:

$("#p1").css("color", "red").slideUp(2000).slideDown(2000);

필요하다면, 더 많은 메소드 호출을 추가 할 수 있습니다.

팁: 체이닝할때는 코드 줄은 꽤 길수 있습니다.

그러나, jQuery는 문법에 매우 엄격하지 않기 때문에

여러분은 여러분이 원하는 형식으로 해도 됩니다, 다음줄에 적어도 되고, 들여써도 되고...편하신 대로 ㅎ

아래처럼 해도 됩니다:

$("#p1").css("color", "red")
.slideUp(2000)
.slideDown(2000);

jQuery 여분의 불필요하게 많은 공백(whitespace)을 없애주고

해당 줄을 한개의 긴 줄의 코드처럼 실행합니다.