티스토리 뷰

AJAX 이야기

AJAX 예제. XML 파일 읽어서 출력하기




이 예제는
http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_xml에서 퍼온 예제입니다.


Get XML data 버튼을 누르면 XML 파일의 정보를 화면에 출력합니다.
 

1. ajax_ex2.html 파일 만들기

<html>
<head>
<script type="text/javascript">
	function loadXMLDoc(url)
	{
	// XMLHttpRequest 객체 생성
	if (window.XMLHttpRequest)
	{
		// code for IE7+, Firefox, Chrome, Opera, Safari
		xmlhttp=new XMLHttpRequest();
	}
	else
	{
		// code for IE6, IE5
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

	xmlhttp.onreadystatechange=function()
	{
		if (xmlhttp.readyState==4 && xmlhttp.status==200)
		{
			document.getElementById('A1').innerHTML=xmlhttp.status;
			document.getElementById('A2').innerHTML=xmlhttp.statusText;
			document.getElementById('A3').innerHTML=xmlhttp.responseText;
		}
	}

	xmlhttp.open("GET",url,true);

	xmlhttp.send();
	}
</script>
</head>

<body>

<h2>Retrieve data from XML file

<p>Status:

<p>Status text:

<p>Response:

<button onclick="loadXMLDoc('note.xml')">Get XML data </body> </html>

2. note.xml 파일 만들기

<xml version="1.0" encoding="ISO-8859-1"?> 
<!-- Edited by XMLSpy?--> 

<note> 
    <to>Tove</to> 
    <from>Jani</from> 
    <heading>Reminder</heading> 
    <body>Don't forget me this weekend!</body> 
</note>


실행해서 Get XML data 버튼을 누르면 아래와 같이 보이게 됩니다.  




댓글