使用Ajax与后台服务器进行交互时，返回的数据并不是都是文本类型，也有xml类型、Jason类型等。
本篇文章主要讲解对返回的xml类型数据进行解析。
示例解析：
我们要做到示例是，有两个下拉选框，第一个下拉框是省份，第二个是所选省下相对应的市。当省份改变时，相对应的市也应改变。例如，当选择广东省时，地区项应包括：广州、深圳、佛山、汕头。
示例图示：
源代码：
<%@ 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 'select.jsp' starting page</title> <Meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <script type="text/javascript"> <!-- var xmlHttp; function createXmlHttp() { if(window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } else if(window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } } function updateSelect() { var selected = document.getElementById("slt1").value; createXmlHttp(); xmlHttp.onreadystatechange = processor; var url = "createXml?selected=" + selected; xmlHttp.open("POST",url,true); xmlHttp.send(null); } function processor() { var result; if(xmlHttp.readyState == 4) { if(xmlHttp.status == 200) { //注意此处是xmlHttp.responseXML而不是xmlHttp.responseText //获取节点名为city的所有节点 result = xmlHttp.responseXML.getElementsByTagName("city"); var slt2 = document.getElementById("slt2"); //将二级下拉框中的所有选项清空 while(slt2.options.length>0) { slt2.removeChild(slt2.childNodes[0]); } //根据返回节点数目构造下拉选项 for(var i=0; i<result.length; i++) { var option = document.createElement("option"); //根据节点名称获取城市名称，并赋值 option.text = result[i].getElementsByTagName("cityname")[0].firstChild.nodeValue; //根据节点名称获取城市值，并赋值 option.value = result[i].getElementsByTagName("cityvalue")[0].firstChild.nodeValue; //千万不要忘记将该节点加入到下拉框父节点中 slt2.options.add(option); } } } } --> </script> </head> <body> <form> 省份： <select id="slt1" onChange="updateSelect()"> <option value="1">河南省</option> <option value="2">广东省</option> </select> 地区： <select id="slt2"> <option>请选择地方</option> <option value="1">濮阳</option> <option value="2">安阳</option> <option value="3">南阳</option> <option value="4">郑州</option> </select> </form> </body> </html>
Servlet源代码：
package com.zyh.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class CreateXml extends HttpServlet {
@Override
protected void doPost(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException {
//这里一定要设置为xml类型的文件，而不是text/html
response.setContentType("text/xml;charset=utf-8");
response.setCharacterEncoding("utf-8");
String selected = request.getParameter("selected");
PrintWriter out = response.getWriter();
out.println("<response>");
if(selected.equals("1")) {
out.println("<city>");
out.println("<cityname>濮阳</cityname>");
out.println("<cityvalue>1</cityvalue>");
out.println("</city>");
out.println("<city>");
out.println("<cityname>安阳</cityname>");
out.println("<cityvalue>2</cityvalue>");
out.println("</city>");
out.println("<city>");
out.println("<cityname>南阳</cityname>");
out.println("<cityvalue>3</cityvalue>");
out.println("</city>");
out.println("<city>");
out.println("<cityname>郑州</cityname>");
out.println("<cityvalue>4</cityvalue>");
out.println("</city>");
} else {
out.println("<city>");
out.println("<cityname>广州</cityname>");
out.println("<cityvalue>1</cityvalue>");
out.println("</city>");
out.println("<city>");
out.println("<cityname>深圳</cityname>");
out.println("<cityvalue>2</cityvalue>");
out.println("</city>");
out.println("<city>");
out.println("<cityname>佛山</cityname>");
out.println("<cityvalue>3</cityvalue>");
out.println("</city>");
out.println("<city>");
out.println("<cityname>汕头</cityname>");
out.println("<cityvalue>4</cityvalue>");
out.println("</city>");
}
out.println("</response>");
out.flush();
out.close();
}
}
原文链接：https://www.f2er.com/ajax/165944.html