Coding Note

[JSON] 예제 - 회원정보 출력하기 본문

Web/Jsp

[JSON] 예제 - 회원정보 출력하기

jinnkim 2022. 2. 14. 00:51

 

JSON 예제 01

- JSON(Javascript Object Notation)로 회원 정보 출력하기

 

 

 

구현

 

 

 

코드

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>JSON 예제 테스트 01</title>
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
	<script type="text/javascript">
		$(function() {
			$("#checkJson").click(function() {
                //이름 저장 JSON 배열
				var jsonStr = '{"name": ["김가나", "김다라", "김마바","김사아","김자차","김카타","김파하"]}';
				var jsonInfo = JSON.parse(jsonStr);
				
				var output = "< 회원정보 ><br>";
				output += "=================<br>";
				for(var i in jsonInfo.name) {					
					output += jsonInfo.name[i] + "<br>";		
				}
				$("#output").html(output);				
			});
		});
	
	</script>
</head>
<body>
	<a id="checkJson" style="cursor: pointer;">회원정보 출력하기</a><br><br>
	<div id="output"></div>
</body>
</html>

 

 

 

< 공부하기 >

1. for...in 문

   - 상속된 열거 가능한 속성들을 포함하여 객체에서 문자열로 키가 지정된 모든 열거 가능한 속성에 대해 반복함.

   - 코드 분석 )

                     - for(var i in jsonInfo.name)

                     - 단축된 for문 사용

 

 

for...in - JavaScript | MDN

for...in문은 상속된 열거 가능한 속성들을 포함하여 객체에서 문자열로 키가 지정된 모든 열거 가능한 속성에 대해 반복합니다. (Symbol로 키가 지정된 속성은 무시합니다.)

developer.mozilla.org

 

'Web > Jsp' 카테고리의 다른 글

[Ajax] 도서 정보 출력하기  (0) 2022.02.11
[JSP] JQuery ajax 공부하기  (0) 2022.02.11
[JSP, DB] DB 연동 - 회원가입_추가하기  (0) 2022.02.08
[JSP, DB] DB 연동 - 회원가입_유효성 검사 및 조회하기  (0) 2022.02.07
[JSP] JDBC 연동 - DB 로그인, 로그아웃하기_2  (0) 2022.02.06
'Web/Jsp' Related Articles more
Comments