AJAX中 XML 很重要,所以本篇将会详细的讲解其相关知识。
实例解释 - loadXMLDoc() 函数
当用户点击上面的“获得 CD 信息”这个按钮,就会执行 loadXMLDoc() 函数。
loadXMLDoc() 函数创建 XMLHttpRequest 对象,添加当服务器响应就绪时执行的函数,并将请求发送到服务器。
当服务器响应就绪时,会构建一个 HTML 表格,从 XML 文件中提取节点(元素),最后使用已经填充了 XML 数据的 HTML 表格来更新 txtCDInfo 占位符:
function loadXMLDoc(url)
{
var xmlhttp;
var txt,xx,x,i;
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)
 {
 txt="<table border='1'><tr><th>Title</th><th>Artist</th></tr>";
 x=xmlhttp.responseXML.documentElement.getElementsByTagName("CD");
 for (i=0;i<x.length;i++)
 {
 txt=txt + "<tr>";
 xx=x[i].getElementsByTagName("TITLE");
 {
 try
 {
 txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
 }
 catch (er)
 {
 txt=txt + "<td> </td>";
 }
 }
 xx=x[i].getElementsByTagName("ARTIST");
 {
 try
 {
 txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
 }
 catch (er)
 {
 txt=txt + "<td> </td>";
 }
 }
 txt=txt + "</tr>";
 }
 txt=txt + "</table>";
 document.getElementById('txtCDInfo').innerHTML=txt;
 }
 }
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
本篇对AJAX中 XML 相关内容做了讲解,更多的学习资料清关注Gxl网即可观看。
下载本文