Ajax返回响应的数据格式：
获取服务器响应使用XMLHTTPRequest对象的两种方法，其返回的文件格式不同：
- responseText(获得字符串类型的响应数据，即HTML格式)
- responseXML（获得xml文件的响应数据）
返回HTML格式的优点：
- 在浏览器端无需JavaScript解析
- 可读性好
- 与innerHTML搭配效率高
缺点：
- 若需要更新页面的多个地方则多次返回HTML文档不合适
- innerHTML并非DOM标准
这时便体现出返回XML文档类型的优越性。XML设计的初衷就是用来传输和存储数据。
onreadystatechange 事件：
当请求被发送到服务器时，我们需要执行一些基于响应的任务。
每当 readyState 改变时，就会触发 onreadystatechange 事件。
readyState 属性存有 XMLHttpRequest 的状态信息。
下面是 XMLHttpRequest 对象的三个重要的属性：
| 属性 | 描述 |
|---|---|
| onreadystatechange | 每当readyState发生变化时，都会触发此函数 |
| readyState | 有0-4五种状态： 0：请求未初始化 1：服务器建连接 2：请求已接收 3：请求处理中 4:处理完毕，响应就绪 从0-4会触发四次onreadystatechange函数 |
| status | 200:响应成功 404:未找到页面 |
省市联动案例：
两个页面：
showCity.jsp
<%@ page language="java" contentType="text/html; charset=utf-8"%>
<script type="text/javascript">
//创建xmlHttpRequest对象
function getXmlHttpObject(){
var xmlhttp;
if (window.ActiveXObject)
{
// IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
//window.alert("其他");
}
else
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest();
}
return xmlhttp;
}
var myXmlRequest="";
function getCity(){
myXmlRequest=getXmlHttpObject();
if(myXmlRequest){
var url="showPro.jsp";
var data="province="+$("province").value;
myXmlRequest.open("post",url,true);
myXmlRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//myXmlRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
myXmlRequest.onreadystatechange=chuli;
myXmlRequest.send(data);
}
}
function chuli(){
//window.alert("处理函数被调回"+myXmlRequest.readyState);
if(myXmlRequest.readyState==4&&myXmlRequest.status==200){
// window.alert(myXmlRequest.status);
window.alert(myXmlRequest.responseXML);
var cities=myXmlRequest.responseXML.getElementsByTagName("city");
$("city").length=1;
for (var i=0;i<cities.length;i++){
var city=cities[i].childNodes[0].nodeValue;
var myOption=document.createElement("option");
myOption.innerText=city;
$("city").appendChild(myOption);
}
}
}
function $(id){
return document.getElementById(id);
}
</script>
<select id="province" οnchange="getCity()">
<option>--省--</option>
<option value="山西">山西省</option>
<option value="湖北">湖北省</option>
</select>
<select id="city" >
<option >--市--</option>
</select>
<select id="xian">
<option >--县--</option>
</select>
showPro.jsp
<%@ page language="java" contentType="text/html; charset=gb2312"%>
<!DOCTYPE html>
<%
request.setCharacterEncoding("utf-8");
response.setContentType("text/xml; charset=gb2312");
//注意这个地方
String province = request.getParameter("province");
System.out.println(province);
//System.out.println(new String("山西".getBytes("ISO-8859-1"),"utf-8"));
//province = new String(province.getBytes("iso-8859-1"),"utf-8");
if(province.equals("山西")){
//System.out.println(province);
out.println("<province><city>太原</city><city>晋中</city><city>临汾</city></province>");
}else if(province.equals("湖北")){
out.println("<province><city>武汉</city><city>咸宁</city><city>黄石</city></province>");
}
%>如果你发现利用responseXML得到的是null,那是因为你设置的response默认返回html类型的文件,所以你需要设置为XML文件，例如上面代码第一行，我用的开发工具直接生成的语句，就没注意，所以返回null，你需要修改此行代码
便是此行代码：
response.setContentType("text/xml; charset=gb2312");运行结果：
结束了，一个小问题耽误了我大概一个小时的时间，都零点了，她睡了吗？
新的一天开始了，加油吧?
