本章目标
使用AJAX + XML完成操作；
可以直接在后台利用DOM动态生成XML文件，并交付给AJAX进行显示。
返回XML数据
在XMLHttpRequest对象中也可以使用responseXML()方法接收一组返回的XML数据，这些返回的XML数据可以动态生成（利用JDOM工具将数据库中的数据变为XML文件），也可以直接读取一个XML文件，当客户端接收到读取的XML文件之后，可以通过DOM解析的方式对数据进行操作。
要回传的XML文件 —— allarea.xml
<?xml version="1.0" encoding="UTF-8"?> <allarea> <area> <id>1</id> <title>北京</title> </area> <area> <id>2</id> <title>天津</title> </area> <area> <id>3</id> <title>南京</title> </area> </allarea>
使用AJAX解析XML，并生成下拉列表框
<html>
<head>
<title>使用 Ajax 解析XML，并生成下拉表框</title>
<script type="text/javascript">
var xmlHttp;//Ajax 核心对象名称
function createXMLHttp(){//创建 XMLHttpRequest 核心对象
xmlHttp = new XMLHttpRequest();//兼容IE9，最新的火狐，最新的谷歌
}
function getCity(){
createXMLHttp();//建立 XMLHttp 核心对象
xmlHttp.open("POST", "allarea.xml");//设置一个请求
//设置请求完成之后处理的回调函数
xmlHttp.onreadystatechange=getCityCallback;
xmlHttp.send(null);//发送请求，不传递任何参数
}
function getCityCallback(){//定义回调函数
if(xmlHttp.readyState==4){//数据返回完毕
if(xmlHttp.status==200){//HTTP操作正常
//取得 allarea 节点下的全部节点
var allarea = xmlHttp.responseXML.getElementsByTagName("allarea")[0].childNodes;
//取得下拉列表框 city 的对象
var select=document.getElementById("city");
select.length = 1;//显示一个内容
select.options[0].selected = true;//设置第一个为选中状态
//循环 allarea 下的子节点
for(var i=0; i<allarea.length; i++){
//取得每一个<area>
var area = xmlHttp.responseXML.getElementsByTagName("allarea")[0];
//取得每一个<area>的中<id>元素内容
var id=area.getElementsByTagName("id")[i].firstChild.nodeValue;
//取得每一个<area>的中<title>元素内容
var title =area.getElementsByTagName("title")[i].firstChild.nodeValue;
//创建 option 元素
var option=document.createElement("option");
//在 option 元素中设置显示的内容
option.setAttribute("value",id);
//在 option 中添加显示的文本内容
option.appendChild(document.createTextNode(title));
//在下拉框中加入 option 属性
select.appendChild(option);
}
}
}
}
</script>
</head>
<body onload="getCity()"><!-- 页面加载时调用 -->
<form action="" method="post">
请选择喜欢的城市：
<select id="city">
<option value="0"> -请选择城市- </option>
</select>
</form>
</body>
</html>
效果图：
使用XML进行数据交换
现在前台页面接收的数据不再像使用传统MVC那样需要编写Java代码了，而只需要将所需的XML数据传回到页面之中即可，而后台的开发语言，可以任意选择，例如：选择PHP或ASP.NET等，这样一个前台页面在各种开发平台下都可以通用了。
小结
通过XML操作可以使数据操作更加的方便，也不受平台限制。
使用AJAX + JavaScript + DOM 操作可以完成各种复杂的前台操作。
相关推荐
关于jquery ajax 调用带参数的webservice返回XML数据一个小细节.docx
使用webservice的方法调用数据库中的数据，然后返回的数据格式的xml.直接显示成xml格式
简单的网络请求与XML处理，一般会用开源代码ASIHttp进行网络请求，XMLParserSDK进行XML解析
主要介绍了Java访问WebService返回XML数据的方法,涉及java操作WebService的相关技巧,需要的朋友可以参考下
cocos2d-x 当中访问WebServer服务器 获取数据并且解析返回XML数据的例子。
XMLReader,XML解析，用于soap请求返回XML数据的解析
该代码是servlet 与外网接口xml的交互，含xml的封装解析
主要介绍了Springmvc如何返回xml及json格式数据,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
项目中集成jersey2.5，轻量快捷的提供rest方式的webservice接口，支持text、xml、json格式数据返回，tomcat与glassfish中都可运行，tomcat中返回不支持json数据类型返回。
如何生成XML？...我们使用第一种方式（拼接字符串）来封装 XML数据接口，代码中有详细注释。 $code, message => $message, data => $data ]; # 更改头部(为了更清晰的展示XML节点) header('Content-t
android访问网络返回的XML数据并且进行解析演示
webservice远程调用，返回String数据并生成xml文件到本地工程，在通过SAX解析器把数据解析出来。这是webservice应用的一个简单的例子。根据该例子的思想，可以实现很多功能了。例如把client工程的sayHello方法改为...
顺丰API接口封装java版本！ 快速下单、订单查询、路由查询3个接口的封装！
Delphi7调C#Webservice用返回ClientDataSet XML格式数据
WebApi 返回 xml 格式数据时自动去除命名空间相关标记
WebView布局使用，okHTTP访问解析服务器返回的json/xml数据。
很早之前用jquery调用带参数的WS返回XML格式数据的时候，传参的时候会出现错误。问了问度娘和谷哥，这娘儿俩一个德行，里面的多数帖子没什么意义，你粘我，我复制你
ajax实现josn,xml,txt返回数据