ajax遍历xml文档的方法
本文实例讲述了ajax遍历xml文档的方法。分享给大家供大家参考。具体分析如下：
XMLHttpRequest对象提供了两个可以用来访问服务器响应的属性。第一个属性responseText将响应提供为一个串，第二个属性responseXML将响应提供为一个XML对象。一些简单的用例就很适合按简单文本来获取响应，如将响应显示在警告框中，或者响应只是指示成功还是失败的词
前面<ajax小结>中的例子是从XMLHttpRequest对象获取服务器响应，并使用XMLHttpRequest对象的responseText属性将响应获取为文本。
这次我们来使用XMLHttpRequest对象的responseXML属性，将结果获取为XML文档.这样一来，我们就可以使用W3CDOM方法来遍历XML文档。(前面文章或多或少讲过些DOM,在此不重复)
OK,下面来看例子.
首先还是一段XML文档代码(parseXML.xml)如下:
parseXML.xml如下：
<?xmlversion="1.0"encoding="UTF-8"?> <states> <north> <state>Minnesota</state> <state>Iowa</state> <state>NorthDakota</state> </north> <south> <state>Texas</state> <state>Oklahoma</state> <state>Louisiana</state> </south> <east> <state>NewYork</state> <state>NorthCarolina</state> <state>Massachusetts</state> </east> <west> <state>California</state> <state>Oregon</state> <state>Nevada</state> </west> </states>
MyJsp.jsp如下：
<%@pagelanguage="java"import="java.util.*"pageEncoding="utf-8"%>
<%
Stringpath=request.getContextPath();
StringbasePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN">
<html>
<head>
<basehref="<%=basePath%>">
<title>MyJSP'MyJsp.jsp'startingpage</title>
<metahttp-equiv="pragma"content="no-cache">
<metahttp-equiv="cache-control"content="no-cache">
<metahttp-equiv="expires"content="0">
<metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">
<metahttp-equiv="description"content="Thisismypage">
<!--
<linkrel="stylesheet"type="text/css"href="styles.css">
-->
</head>
<scripttype="text/javascript">
varflg=false;
varrequestType="";
//得到XMLHttpRequest对象
functionnewXMLHttpRequest(){
varxmlreq=false;
if(window.XMLHttpRequest){
xmlreq=newXMLHttpRequest();
}elseif(window.ActiveXObject){
try{
xmlreq=newActiveXObject("Msxml2.XMLHTTP");
}catch(e1){
try{
xmlreq=newActiveXObject("Microsoft.XMLHTTP");
}catch(e2){}
}
}
returnxmlreq;
}
functionstartRequest(requestedList){
requestType=requestedList;
flg=newXMLHttpRequest();
//当XMLHttpRequest对象在请求过程中间状态改变的时候
//回来调用handleStateChange方法
flg.onreadystatechange=handleStateChange;
flg.open("GET","parseXML.xml",true);
flg.send(null);
}
//处理函数
functionhandleStateChange(){
if(flg.readyState==4){
if(flg.status==200){
if(requestType=="north"){
listNorthStates();
}elseif(requestType=="all"){
listAllStates();
}if(requestType=="south"){
listSouthStates();
}
}
}
}
//用于显示NorthStates方法
functionlistNorthStates(){
varxmlDoc=flg.responseXML;
varnorthNode=xmlDoc.getElementsByTagName("north")[0];
varnorthStates=northNode.getElementsByTagName("state");
outputList("NorthStates",northStates);
}
//用于显示SouthStates方法
functionlistSouthStates(){
varxmlDoc=flg.responseXML;
varSouthNode=xmlDoc.getElementsByTagName("south")[0];
varSouthStates=SouthNode.getElementsByTagName("state");
outputList("SouthStates",SouthStates);
}
//用于显示AllStates方法
functionlistAllStates(){
varxmlDoc=flg.responseXML;
varallStates=xmlDoc.getElementsByTagName("state");
outputList("AllStatesinDocument",allStates);
}
//输出元素并显示于提示框中
functionoutputList(title,states){
varout=title;
varcurrState=null;
for(vari=0;i<states.length;i++){
currState=states;
out=out+"\n-"+currState.childNodes[0].nodeValue;
}
alert(out);
}
</script>
<body>
<formaction="#">
<inputtype="button"value="ViewAllListedStates"
onclick="startRequest('all');"/><br>
<inputtype="button"value="ViewAllListedNorthernStates"
onclick="startRequest('north');"/><br>
<inputtype="button"value="ViewAllListedSouthernStates"
onclick="startRequest('south');"/>
</form>
</body>
</html>
希望本文所述对大家的Ajax程序设计有所帮助。