코딩 화면
<!-- jQuery로 배열 객체 다루기 -->
<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://code.jquery.com/jquery-3.1.1.js"></script>
<script>
$(function(){
// 배열 선언
var array = [
// key-value 객체
{name: 'daum', link: 'http://www.daum.net'},
{name: 'google', link: 'http://www.google.com'},
{name: 'github', link: 'http://www.github.com'}
];
// jQuery에서 배열의 순환 : $.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>
구현 화면
'국비지원과정 - 자바(JAVA)를 활용한 안드로이드 앱 개발 > HTML5 + CSS + JavaScript' 카테고리의 다른 글
웹(Web) 과정 - 15일차(ex10) / 객체에 클래스 속성 넣기 / jQuery (0) | 2019.12.05 |
---|---|
웹(Web) 과정 - 15일차(ex10) / 객체에 클래스 속성 넣기 / jQuery (0) | 2019.12.05 |
웹(Web) 과정 - 15일차(ex08) / 위치 필터 선택자 / jQuery (0) | 2019.12.05 |
웹(Web) 과정 - 15일차(ex07) / 위치 필터 선택자 / jQuery (0) | 2019.12.05 |
웹(Web) 과정 - 15일차(ex06) / option 태그의 선택된 값 가져오기 / jQuery (0) | 2019.12.05 |