AJAX XML 예제

AJAX는 XML 파일과의 대화식 통신에 사용될 수 있습니다.


AJAX XML 예제

다음 예제는 AJAX로, 웹 페이지가 XML 파일에서, 정보를 가져올 수 있는 방법을 보여줍니다:

Example

The XMLHttpRequest Object



The XMLHttpRequest Object




예제 설명

사용자가 위의 “Get CD info” 버튼을 클릭하면, loadDoc() 함수가 실행됩니다.

loadDoc() 함수는 XMLHttpRequest 객체를 만들고, 서버 응답이 준비되었을 때 실행할 함수를 추가 한 다음, 서버에 요청을 보냅니다.

서버 응답이 준비되면, HTML 테이블이 작성되고, XML 파일에서 nodes(요소)가 추출되고, 마지막으로 XML 데이터로 채워진 HTML 테이블로 “demo” 요소가 업데이트됩니다.:

LoadXMLDoc()


function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    myFunction(this);
    }
  };
  xhttp.open("GET", "cd_catalog.xml", true);
  xhttp.send();
}
function myFunction(xml) {
  var i;
  var xmlDoc = xml.responseXML;
  var table="ArtistTitle";
  var x = xmlDoc.getElementsByTagName("CD");
  for (i = 0; i " +
    x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue +
    "";
  }
  document.getElementById("demo").innerHTML = table;
}

XML 파일

위 예제에서 사용된 XML 파일은 다음과 같습니다: "cd_catalog.xml".

출처: AJAX XML Example

Leave a comment