AJAX XML Приклад
AJAX можна використовувати для інтерактивного спілкування з файлом XML.
AJAX XML Приклад
Наступний приклад продемонструє, як вебсторінка може отримати інформацію з файлу XML за допомогою AJAX:
Пояснення прикладу
Коли користувач натискає кнопку "Отримати інформацію про CD", виконується функція loadDoc().
Функція loadDoc() створює об’єкт XMLHttpRequest, додає функцію, яка буде виконана, коли відповідь сервера готова та надсилає запит на сервер.
Коли відповідь сервера готова, створюється HTML-таблиця, вузли (елементи) витягуються з XML-файлу, і нарешті оновлюється елемент "demo" із таблицею HTML, заповненою даними XML:
function loadDoc() {
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {myFunction(this);}
xhttp.open("GET", "cd_catalog.xml");
xhttp.send();
}
function myFunction(xml) {
const xmlDoc = xml.responseXML;
const x = xmlDoc.getElementsByTagName("CD");
let table="<tr><th>Artist</th><th>Title</th></tr>";
for (let 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;
}
XML Файл
XML-файл, використаний у прикладі вище, виглядає так: "cd_catalog.xml".
