개발관련/JQuery
jquery each method
후니의 개발이야기
2014. 6. 7. 10:59
728x90
반응형
jquey 를 사용하다보면 배열이라던지 json 으로 ajax통신으로 받은 내용을 동적으로 화면에 생성을 해줘야하는 경우가 종종 있는데 이것을 응용한다면 화면에 좀 더 dynamic하게 화면을 구성할 수 있지않을까해서 정리를 해본다.
아래의 예를 단순한 예를 가지고 적용을 해 본것이니 구현단계에서는 다르게 보아도 무방하리라 생각이 든다.
var arr = [
{name: '네이버', url : 'http://www.naver.com'},
{name: '다음', url : 'http://www.daum.net'}
];
var data = "";
$.each(arr, function(i, element){
data += "<a href='"+element.url+"' >" + element.name + "</a><br />";
});
$(#div).html(data)
위와 같이 구현을 해주면 된다.
each 메소드 는 보통 아래와 같은 형식으로 많이 써준다.
$.each(object, function(index,item){
}); => object 요소의 길이만큼 반복해서 실행 , index : 0 부터 시작, item : 현재 each method 에 의해 선택된 객체
$(선택자).each(function(index, item){
}); => selector 요소의 길이만큼 반복하면서 함수를 실행 , 나머지는 위와 동일
728x90
반응형