ajax遍历xml文档的方法

2024-09-01 08:28:29

字体：大中小

来源：转载

供稿：网友

本文实例讲述了ajax遍历xml文档的方法。。具体分析如下：

XMLHttpRequest对象提供了两个可以用来访问服务器响应的属性。第一个属性responseText将响应提供为一个串，第二个属性 responseXML将响应提供为一个XML对象。一些简单的用例就很适合按简单文本来获取响应，如将响应显示在警告框中，或者响应只是指示成功还是失败的词
前面<ajax小结>中的例子是从XMLHttpRequest对象获取服务器响应，并使用XMLHttpRequest对象的responseText属性将响应获取为文本。
这次我们来使用XMLHttpRequest对象的responseXML属性，将结果获取为XML文档.这样一来，我们就可以使用W3C DOM方法来遍历XML文档。(前面文章或多或少讲过些DOM,在此不重复)

OK,下面来看例子.

首先还是一段XML文档代码(parseXML.xml)如下:

parseXML.xml如下：

<?xml version="1.0" encoding="UTF-8"?><states><north><state>Minnesota</state><state>Iowa</state><state>North Dakota</state></north><south><state>Texas</state><state>Oklahoma</state><state>Louisiana</state></south><east><state>New York</state><state>North Carolina</state><state>Massachusetts</state></east><west><state>California</state><state>Oregon</state><state>Nevada</state></west></states>

MyJsp.jsp如下：

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><base href="<%=basePath%>"><title>My JSP 'MyJsp.jsp' starting page</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--></head><script type="text/javascript">var flg=false;var requestType = "";//得到XMLHttpRequest对象function newXMLHttpRequest() {var xmlreq = false;if (window.XMLHttpRequest) {xmlreq = new XMLHttpRequest();} else if (window.ActiveXObject) {try {xmlreq = new ActiveXObject("Msxml2.XMLHTTP");} catch (e1) {try {xmlreq = new ActiveXObject("Microsoft.XMLHTTP");} catch (e2) {}}}return xmlreq;}function startRequest(requestedList){requestType=requestedList;flg=newXMLHttpRequest();//当XMLHttpRequest对象在请求过程中间状态改变的时候//回来调用handleStateChange方法flg.onreadystatechange = handleStateChange;flg.open("GET", "parseXML.xml", true);flg.send(null);}//处理函数function handleStateChange(){if(flg.readyState==4){if(flg.status==200){if(requestType=="north"){listNorthStates();}else if(requestType=="all"){listAllStates();}if(requestType=="south"){listSouthStates();}}}}//用于显示NorthStates方法function listNorthStates(){var xmlDoc=flg.responseXML;var northNode=xmlDoc.getElementsByTagName("north")[0];var northStates=northNode.getElementsByTagName("state");outputList("North States",northStates);}//用于显示SouthStates方法function listSouthStates(){var xmlDoc=flg.responseXML;var SouthNode=xmlDoc.getElementsByTagName("south")[0];var SouthStates=SouthNode.getElementsByTagName("state");outputList("South States",SouthStates);}//用于显示AllStates方法function listAllStates(){var xmlDoc=flg.responseXML;var allStates=xmlDoc.getElementsByTagName("state");outputList("All States in Document", allStates);}//输出元素并显示于提示框中function outputList(title,states){var out=title;var currState=null;for(var i=0;i<states.length;i++){currState=states;out=out+"/n-"+currState.childNodes[0].nodeValue;}alert(out);}</script><body><form action="#"><input type="button" value="View All Listed States"  onclick="startRequest('all');"/><br><input type="button" value="View All Listed Northern States"  onclick="startRequest('north');"/><br><input type="button" value="View All Listed Southern States"  onclick="startRequest('south');"/></form></body></html>

上一篇：Ajax上传实现根据服务器端返回数据进行js处理的方法

下一篇：Ajax获取响应内容长度的方法