Mẫu XML AJAX

AJAX có thể được sử dụng để giao tiếp tương tác với tệp XML.

Mẫu XML AJAX

Ví dụ sau đây minh họa cách trang web sử dụng AJAX để đọc thông tin từ tệp XML:

Ví dụ

Thử ngay

Giải thích ví dụ

Khi người dùng nhấn nút "Lấy thông tin CD", hàm loadDoc() sẽ được thực thi.

hàm loadDoc() tạo đối tượng XMLHttpRequest, thêm hàm sẽ được thực thi khi máy chủ phản hồi xong và gửi yêu cầu đến máy chủ.

Khi máy chủ phản hồi xong, xây dựng bảng HTML, từ tệp XML lấy các nút (thuộc tính), cuối cùng cập nhật phần tử "demo" bằng bảng HTML được điền đầy dữ liệu XML:

LoadXMLDoc()

function loadDoc() {
  var xhttp = new XMLHttpRequest();
   xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    myFunction(this);
     }
  };
  xhttp.open("GET", "music_list.xml", true);
  xhttp.send();
}
function myFunction(xml) {
  var i;
  var xmlDoc = xml.responseXML;
  var table="<tr><th>Artista</th><th>Ca khúc</th></tr>";
  var x = xmlDoc.getElementsByTagName("TRACK");
  for (i = 0; i <x.length;  i++) { 
    table += "<tr><td>" +
    x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue  +
    "</td><td>" +
    x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue  +
    "</td></tr>";
  }
   document.getElementById("demo").innerHTML = table;
}

Tệp XML

Tệp XML được sử dụng trong ví dụ trước tương tự như vậy: "music_list.xml"。