©TCP-tryWWW

<!DOCTYPE html>
<html lang="ko">

<head>
	<meta charset="UTF-8">
	<title>XML XMLHttpRequest</title>
	<script>
		function loadDoc() {
			var xmlHttp = new XMLHttpRequest();			// XMLHttpRequest 객체를 생성함.
			xmlHttp.onreadystatechange = function() {	// onreadystatechange 이벤트 핸들러를 작성함.
				// 서버상에 문서가 존재하고 요청한 데이터의 처리가 완료되어 응답할 준비가 완료되었을 때
				if(this.status == 200 && this.readyState == this.DONE) {
					processXMLObj(xmlHttp);
				}
			};
			xmlHttp.open("GET", "/examples/media/programming_languages.xml", true);
			xmlHttp.send();
		}

		function processXMLObj(xmlHttp) {
			var xmlObj, nameList, result, idx;
			xmlObj = xmlHttp.responseXML;	// 요청한 데이터를 XML DOM 객체로 반환함.
			nameList = xmlObj.getElementsByTagName("name");	// XML DOM 객체에서 id가 "name"인 요소들을 선택함.
			result = "";
			for(idx = 0; idx < nameList.length; idx++) {
				// id가 "name"인 요소들의 텍스트 노드를 찾아 그 값을 반환함.
				result += nameList[idx].childNodes[0].nodeValue + "<br>";
			}
			document.getElementById("text").innerHTML = result;
		}
	</script>
</head>

<body>

	<h1>XMLHttpRequest 객체의 전송</h1>
	<button onclick="loadDoc()">요청 전송하기!</button>
	<p id="text"></p>
	
</body>

</html>