[jQuery] .each() - 선택한 요소의 함수를 반복 실행하는 메서드

안녕하세요. 경제적, 시간적 자유를 꿈꾸는 한량입니다.

jQuery의 .each() 사용법

jQuery의 .each()는 선택한 요소 집합에서 

각 요소에 대해 지정된 함수를 반복적으로 실행하기 위해 사용됩니다.

 

이 함수는 주어진 요소 집합에 대해 반복문을 실행하면서, 

각 요소에 대해 지정된 함수를 실행합니다. 

함수는 현재 요소의 인덱스와 값에 대한 매개 변수를 전달받을 수 있으며, 

이를 통해 요소를 조작하거나 정보를 추출할 수 있습니다.

 

'#myList'의 각 '<li>' 요소의 텍스트 콘텐츠를 출력하는 jQuery 코드는 다음과 같이 작성할 수 있습니다.

// javascript code
$('#myList li').each(function(index, element) {
  console.log(index + ": " + $(element).text());
});

// html code
<ul id="myList">
  <li>Apple</li>
  <li>Banana</li>
  <li>Orange</li>
</ul>

위 코드에서 .each() 메서드는 '#myList'의 '<li>' 요소를 반복하면서, 

각 요소의 인덱스와 텍스트 콘텐츠를 결과를 다음과 같이 출력합니다
0: Apple
1: Banana
2: Orange

이처럼 .each() 메서드는 배열 또는 객체의 각 요소에 대해 반복 작업을 수행할 때 사용됩니다. 

이 함수를 통해, 데이터를 동적으로 처리하거나 화면에 표시하는 등의 작업을 수행할 수 있습니다.