note

$.each() 메서드 사용 본문

JavaScript/jQuery

$.each() 메서드 사용

투한 2012. 3. 20. 10:40










<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="http://code.jquery.com/jquery-1.7.js"></script>
<script>
	$(document).ready(function (){
		//변수를 선언합니다.
		var array = [
		             { name : 'Hanbit Media' , link:'http://hanb.co.kr' },
		             { name : 'Daum' , link: 'http://daum.net' },
		             { name : 'Naver' , link: 'http://naver.com' },
		             { name : 'Paran' , link: 'http://paran.com' }
		             ];
			
			//$.each() 메서드를 사용합니다.
			$.each(array,function(index, item){
			
			//변수를 선언합니다
			var output='';
			
			//문자열을 만듭니다.
			output += '<a href="' + item.link + '">';
			output += '<h1>' + item.name + '</h1>';
			output += '</a>';
			
			//집어 넣습니다
			document.body.innerHTML += output;
		});
	});
	
</script>
</head>
<body>

</body>
</html>


배열을 만들고 그안에 객체를 넣는다

index는 배열의 index 이고 item은 객체의 name,link등을 뜻함

하이퍼링크를 사용하기 위해 <a> 태그를 사용 





'JavaScript > jQuery' 카테고리의 다른 글

each() 메서드를 사용한 서로 다른 클래스 적용 / each() / addClass()  (0) 2012.03.20
addClass() 메서드  (0) 2012.03.20
함수 필터 선택자  (0) 2012.03.20
필터 선택자  (0) 2012.03.20
입력 양식 필터 선택자  (0) 2012.03.20