[JQuery] Jquery(제이쿼리) each()로 배열 접근하기

< each() >

 

 

- 사용자가 선택한 여러 개의 요소에 순차적으로 접근하는 동작이다

- 배열에서 유용함

- 자바에서 foreach문과 비슷하게 생각하면 될듯

- 아래 두가지 방법이 있다 ( 결과는 같음 )

  · $(요소).each(function(매개변수, ...){ } );

  · $.each(요소, function(매개변수, ...) { } );

 

 

① 배열의 값들을 테이블에 삽입하기

 

- 2차원배열은 JSON 형태와 유사하다.

- name과 addr은 Object 값들을 불러올 때 쉽게 불러올 수 있다.

 

var arr = [
  {name:'홍길동1',addr:'부산'},
  {name:'홍길동2',addr:'울산'},
  {name:'홍길동3',addr:'서울'},
  {name:'홍길동4',addr:'대구'}
];
			
$.each(arr,function(index,obj){
	$('table').append("<tr><td>"+obj.name+"</td><td>"+obj.addr+"</td></tr>");
});

<table border="1">
 	<tr>
 	  <th>이름</th>
 	  <th>주소</th>
 	</tr>
 </table>

$(arr).each(function(index,obj){
	$('table').append("<tr><td>"+obj.name+"</td><td>"+obj.addr+"</td></tr>");
});

- 이렇게 표현할 수도 있음

- each() 함수로 배열을 4행까지 돌면서 table 뒤에 이름과 주소를 한 행씩 붙여줌