jQuery로 배열을 관리할 때는 each( ) 메서드를 사용한다
each( ) 메서드는 매개변수로 입력한 함수를 통해 for in 반복문처럼 객체나 배열의 요소를 검사하는 메서드이다
each( ) 메서드는 다음과 같이 두 가지 형태로 사용한다
$.each(object, function(index, item){})
$(selector).each(function(index, item){})
$(function () {
var array = [
{ name: 'Hanbit Media', link: 'http://hanbit.co.kr' },
{ name: 'Naver', link: 'http://naver.com' },
{ name: 'Daum', link: 'http://daum.net' }
]
$.each(array, function (index, item) {
var output = '';
output += '<a href="' + item.link + '">';
output += ' <h1>' + item.name + '</h1>';
output += '</a>';
document.body.innerHTML += output;
});
});
index : 배열의 인덱스 또는 객체의 키
item : 인덱스나 키가 가진 값
Ajax 사용시 $.each() 형태 메서드를 굉장히 많이 사용한다
ECMAScript 5의 forEach() 메서드와 차이점
[].forEach(function(item, index){});
$.each(function(index, item){});
// 매개변수의 순서가 다르다
'Frontend > jQuery' 카테고리의 다른 글
| JS jQuery (part. 07) - 객체 확장 (0) | 2020.07.30 |
|---|---|
| JS jQuery (part. 06) - 배열 관리 2 (0) | 2020.07.30 |
| JS jQuery (part. 04) - 필터 선택자 (0) | 2020.07.29 |
| JS jQuery (part. 03) - 속성 선택자 (0) | 2020.07.29 |
| JS jQuery (part. 02) - 선택자 (0) | 2020.07.29 |