jQuery - 체이닝
jQuery를 사용하면 작업/메서드를 함께 연결할 수 있습니다.
연결을 사용하면 단일 문 내에서 동일한 요소에서 여러 jQuery 메서드를 실행할 수 있습니다.
jQuery 메소드 체이닝
지금까지 우리는 jQuery 문을 한 번에 하나씩 작성했습니다.
그러나 동일한 요소에서 여러 jQuery 명령을 차례로 실행할 수 있도록 하는 연결이라는 기술이 있습니다.
팁: 이렇게 하면 브라우저가 동일한 요소를 두 번 이상 찾을 필요가 없습니다.
작업을 연결하려면 이전 작업에 작업을 추가하기만 하면 됩니다.
다음 예제 css()에서는 slideUp(), 및 slideDown()
메서드를 연결합니다. "p1" 요소가 먼저 빨간색으로 변경된 다음 위로 슬라이드한 다음 아래로 슬라이드합니다.
예시
$("#p1").css("color", "red").slideUp(2000).slideDown(2000);
필요한 경우 메서드 호출을 더 추가할 수도 있습니다.
팁 : 연결 시 코드 줄이 상당히 길어질 수 있습니다. 그러나 jQuery는 구문에 대해 그다지 엄격하지 않습니다. 줄 바꿈 및 들여쓰기를 포함하여 원하는 대로 형식을 지정할 수 있습니다.
이것은 또한 잘 작동합니다:
예시
$("#p1").css("color", "red")
.slideUp(2000)
.slideDown(2000);
jQuery는 여분의 공백을 버리고 위의 줄을 하나의 긴 코드 줄로 실행합니다.