©TCP-tryWWW

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

<head>
	<meta charset="UTF-8">
	<title>Ajax XMLHttpRequest</title>
	<script>
		function sendRequest() {
			var httpRequest;
			function createRequest() {
				if (window.XMLHttpRequest) {	// 익스플로러 7과 그 이상의 버전, 크롬, 파이어폭스, 사파리, 오페라 등
					return new XMLHttpRequest();
				} else {						// 익스플로러 6과 그 이하의 버전
					return new ActiveXObject("Microsoft.XMLHTTP");
				}
			}
			function receiveResponse() {
				// XMLHttpRequest 객체의 현재 상태가 요청 완료이고, 서버에 문서가 존재하면 받은 데이터를 출력함.
				if (httpRequest.readyState == XMLHttpRequest.DONE && httpRequest.status == 200 ) {
					document.getElementById("text").innerHTML = httpRequest.responseText;
				}
			}
			httpRequest = createRequest();	// XMLHttpRequest 객체를 생성함.
			httpRequest.onreadystatechange = receiveResponse;			// XMLHttpRequest 객체의 현재 상태를 파악함.
			// GET 방식의 비동기식 요청으로 Http 요청을 생성함.
			httpRequest.open("GET", "/examples/media/ajax_intro_data.txt", true);
			httpRequest.send();			// Http 요청을 보냄.
		}
	</script>
</head>

<body>

	<h1>XMLHttpRequest 객체의 생성</h1>
	<button type="button" onclick="sendRequest()">Ajax 요청 보내기!</button>
	<p id="text"></p>
	
</body>

</html>