Ex03 . people.js / personJSONReader.jsp

JSP/AJAX.1

Ex03 . people.js / personJSONReader.jsp

GAWON 2023. 6. 23. 10:10

{"name":"김", "age":20}

<%@ 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>
<script type="text/javascript" src="../js/json2.js?ver=1"></script>
</head>
<body>
	<script type="text/javascript">
		var xhr = new XMLHttpRequest();
		
		xhr.onreadystatechange = function(){
			if(xhr.readyState == 4 && xhr.status == 200){
				
				//var jsonObj = eval( "(" + xhr.responseText + ")" );
				var jsonObj = JSON.parse(xhr.responseText);
				
				// 만약 JSON.parse가 동작하지 않으면
				// json2.js 파일을 포함하여 사용할 수 있다.
				// json.org > JavaScript > json2.js 다운로드
				// WebContent/js 폴더 생성 후 json2.js 저장
				// <script src="../js/json2.js"> 추가하여 사용
				
				document.body.innerHTML += jsonObj.name + "<br>";
				document.body.innerHTML += jsonObj.age + "<br>";
			}
		}
		
		xhr.open("get", "people.js", true);
		xhr.send();
		
		
		
		
	</script>
</body>
</html>

저작자표시