JSON이란 JSON(제이슨[1], JavaScript Object Notation)은 속성-값 쌍( attribute–value pairs and array data types (or any other serializable value)) 또는 "키-값 쌍"으로 이루어진 데이터 오브젝트를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷이다.
개방형 표준 - 위키백과, 우리 모두의 백과사전
ko.wikipedia.org
쉽게 말해, 가볍게 속성-값을 표현하는 데이터 형식이다.
https://nesoy.github.io/articles/2017-02/JSON
JSON이란 무엇일까??
nesoy.github.io
# JQuery 사용하기
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body >
<button id="btn" style="color:white; background: #9198e5;">script event</button>
<button id="clearBtn" style="color:white; background: #e66465;">script clear</button>
<div id="result">
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript">
var obj = { id : 'swyoon', pwd : 'swyoon' } ;
var ary = [{ id : 'swyoon', pwd : 'swyoon' } , { id : 'swyoon', pwd : 'swyoon' }] ;
var map = {"list01" : [{ id : 'swyoon', pwd : 'swyoon' } , { id : 'swyoon', pwd : 'swyoon' }] ,
"list02" : [{ id : 'jslim', pwd : 'jslim' } , { id : 'jslim', pwd : 'jslim' }] } ;
$(document).ready(function(){
$('#btn').click(function(){
// window.alert("이벤트 확인");
// document 작성 함수
// text(), append(), html()
// $('#result').html("<font color='red'>" +obj.id + "</font>" +" , " + obj.pwd );
// $.each(ary , function(idx, data){
// $('#result').append(data.id +" , " + data.pwd +"<br/>");
//}) ;
printAry(map.list01);
printAry(map.list02);
});
// bind 키워드 통해 clearBtn 눌리면 전부 지우기
$('#clearBtn').bind('click' , function() {
// 내용 삭제
$('#result').empty();
// 태그 완전 삭제
$('#result').remove();
}) ;
});
// Script Function
function printAry(aryData){
$.each(aryData , function(idx, data){
$('#result').append(data.id +" , " + data.pwd +"<br/>");
}) ;
}
</script>
</body>
</html>
'Archived(Programming) > Spring #1(기초)' 카테고리의 다른 글
| Web_Spring (0) | 2020.02.03 |
|---|---|
| Web_JSON (0) | 2020.02.03 |
| Web_MVC (0) | 2020.01.31 |
| Web_웹의 기본 (0) | 2020.01.30 |
| Web_JSP와 SERVLET (0) | 2020.01.29 |
