AJAX 可用于同 XML文件进行交互式通信
AJAX XML 实例
下面的例子演示网页如何通过 AJAX 从 XML 文件读取信息：
- 当用户点击“获取 CD 信息”按钮时，执行 loadDoc() 函数。
- loadDoc() 函数创建 XMLHttpRequest 对象，添加当服务器响应就绪时执行的函数，并向服务器发送请求。
- 当服务器响应就绪后，构建 HTML 表格，从 XML 文件提取节点（因素），最后使用由 XML 数据填充的 HTML 表格对元素“demo”进行更新：
<!DOCTYPE html>
<html>
<style>
table,th,td {
border : 1px solid black;
border-collapse: collapse;
}
th,td {
padding: 5px;
}
</style>
<body>
<button type="button" onclick="loadDoc()" >获取我的音乐列表</button>
<br><br>
<table id="demo"> </table>
<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange= function() {
if(this.readyState== 4&& this.status == 400){
myFunction(this);
}
}
xhttp.open("GET" ,"/demo/music_list.xml", true);
xhttp.send();
}
function myFunction(xhttp){
var i, xmlDoc = xhttp.responseXML;
var table="<tr><th>艺术家</th><th>曲目</th></tr>";
var x= xmlDoc,getElementByTagName("TRACK");
for (i=0; i<x.length; i++){
table += "<tr><tb>"+ x[i].getElementByTagName("ARTIST")[0].childNodes[0].nodeValue + "</td><td>" +
x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue +
"</td></tr>";
}
document.getElementById("demo").innerHTML = table;
}
</script>
</body>
</html>
