jQuery는 각 요소를 순환하고 작업을 수행하기 위해 each 메소드를 제공합니다. each 메소드는 반복문을 사용하여 각 요소에 대해 지정된 함수를 실행할 수 있도록 돕습니다.

jQuery each 메소드 사용하기

each 메소드를 사용하여 jQuery 객체의 각 요소에 대해 작업을 수행할 수 있습니다. 이 메소드는 선택한 요소 집합을 반복하면서 각 요소에 대해 지정된 동작을 수행합니다.

다음은 간단한 예제입니다.

$("li").each(function() {
  console.log($(this).text());
});

위 예제에서는 li 요소들을 순환하면서 각 요소의 텍스트를 콘솔에 출력합니다.

jQuery each 메소드와 콜백 함수

each 메소드의 매개변수로 전달되는 콜백 함수는 각 요소에 대해 실행됩니다. 이 콜백 함수는 매개변수로 index와 element를 받을 수 있습니다. index는 현재 요소의 인덱스이고, element는 현재 요소 자체를 가리킵니다.

다음은 콜백 함수를 사용한 예제입니다.

$("li").each(function(index, element) {
  console.log(`Index: ${index}, Text: ${$(element).text()}`);
});

위 예제에서는 콜백 함수가 요소의 인덱스와 텍스트를 콘솔에 출력합니다.

마무리

each 메소드를 사용하면 jQuery 객체의 각 요소에 대해 작업을 수월하게 수행할 수 있습니다. 콜백 함수를 활용하여 각 요소에 대한 추가적인 작업을 쉽게 구현할 수 있습니다.

더 많은 정보를 원하시면 jQuery 공식 문서를 참고하시기 바랍니다.