- JSON
- JavaScript Object Notation
- 데이터 저장 및 전송을 위한 형식으로 서버에서 웹 페이지로 데이터를 보낼 때 사용한다.
- JSON 데이터는 이름(속성)-값 쌍으로 이루어져 있다.
//기본형식
var person = {"name":"james", "age":"30", "city":"seoul"};
//배열
var people = {"students":[
{"name":"james", "age":"30", "city":"seoul"},
{"name":"kim", "age":"30", "city":"newyork"},
{"name":"sarah", "age":"30", "city":"london"}
]};
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h3>JSON 데이터 출력</h3><br>
<p id="demo"></p><br>
<p id="demo2"></p><br>
<p id="demo3"></p><br>
<p id="demo4"></p><br>
<p id="demo5"></p>
<script>
var person = {"name":"james", "age":"30", "city":"seoul"};
var people = {"students":
[{"name":"james", "age":"30", "city":"seoul"},
{"name":"kim", "age":"30", "city":"newyork"},
{"name":"sarah", "age":"30", "city":"london"}
]};
document.getElementById("demo").innerHTML = "person.name --> " + person.name;
document.getElementById("demo2").innerHTML = "people.students --> " + people.students;
document.getElementById("demo3").innerHTML = "people.students[1] --> " + people.students[1];
document.getElementById("demo4").innerHTML = "people.students[1].name --> " + people.students[1].name ;
var text="";
for(var i=0; i<people.students.length; i++) {
text += "이름: " + people.students[i].name;
text += ", 나이: " + people.students[i].age;
text += ", 도시: " + people.students[i].city + "<br>";
}
document.getElementById("demo5").innerHTML = text;
</script>
</body>
</html>
'프론트엔드 > JavaScript' 카테고리의 다른 글
[JavaScript] Validation Check (0) | 2021.05.21 |
---|---|
[JavaScript] JSON parse (0) | 2021.05.21 |
[JavaScript] window.onload (0) | 2021.05.20 |
[JavaScript] 배열 (0) | 2021.05.20 |
[JavaScript] 자바스크립트 기초 정리 (0) | 2021.05.18 |