AJAX读取XML到表格
2012-01-17 16:47 依水间 阅读(1408) 评论(0) 编辑 收藏 举报<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<script type="text/javascript">
/*
*@author liang
*@date 2006-05-11
*/
var xmlHttp;
function createXMLHttpRequest()
{
if(window.ActiveXObject)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}else if(window.XMLHttpRequest)
{
xmlHttp=new XMLHttpRequest();
}
}
function doSearch()
{
createXMLHttpRequest();
xmlHttp.onreadystatechange=handleStateChange;
xmlHttp.open("GET","dynamicContent.xml",true);
xmlHttp.send(null);
}
function handleStateChange()
{
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
//clearPreviousResults();
parseResults();
}
}
}
function clearPreviousResults()
{
var header=document.getElementById("header");
if(header.hasChildNodes())
{
header.removeChild(header.childNodes[0]);
}
var tableBody=document.getElementById("resultBody");
while(tableBody.childNodes.length>0)
{
tableBody.removeChild(tableBody.childNodes[0]);
}
}
function parseResults()
{
var results=xmlHttp.responseXML;
var property=null;
var address="";
var price="";
var comments="";
var properties=results.getElementsByTagName("property");
for(var i=0;i<properties.length;i++)
{
property=properties[i];
address=property.getElementsByTagName("address")[0].childNodes[0].data;
price=property.getElementsByTagName("price")[0].firstChild.nodeValue;
comments=property.getElementsByTagName("comments")[0].firstChild.data;
addTableRow(address,price,comments);
}
var header=document.createElement("h2");
var headerText=document.createTextNode("Results:");
header.appendChild(headerText);
document.getElementById("header").appendChild(header);
}
function addTableRow(address,price,comments)
{
var tmpstr0=address;
var tmpstr1=price;
var tmpstr2=comments
var table=document.getElementById("resultBody");
var newRow=table.insertRow();
var rowLen=table.rows.length;
var rowPos=newRow.rowIndex;
var cellLen=table.rows(0).cells.length;
if(rowLen==1)
{
for(var i=0;i<3;i++)
{
table.rows(0).insertCell();
table.rows(0).cells(i).innerHTML=eval("tmpstr"+i);
}
}else if(rowLen>1)
{
for(var i=0;i<cellLen;i++)
{
table.rows(rowPos).insertCell();
table.rows(rowPos).cells(i).innerHTML=eval("tmpstr"+i);
}
}
}
</script>
<input type="button" value="doSearch" onclick="doSearch();"/>
<span id="header">
</span>
<table id="resultBody" name="resultBody" border="1">
</table>
</BODY>
</HTML>
dynamicContent.xml----------------------------
<?xml version="1.0" encoding="gb2312"?>
<properties>
<property>
<address>812 Gwyn Ave</address>
<price>$100.00</price>
<comments>Quiet serene neighborhood</comments>
</property>
<property>
<address>3308 James Ave</address>
<price>$110.00</price>
<comments>Close to shcools,shopping</comments>
</property>
<property>
<address>98320 County Rd 110</address>
<price>$115.00</price>
<comments>Small arceage outside of town</comments>
</property>
</properties>
