第二種方式：使用XMLHttpRequest對象的responseXML的方式來接受XML數據對象的DOM對象
在ajax學習筆記1中已經對準備工作和需要用到的知識做瞭比較詳細的介紹，本節主要介紹需要修改的代碼以及新增的代碼
.新增一個servlet類
AJAXXMLServer.java
代碼如下:
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.ServletException;
import java.io.IOException;
import java.io.PrintWriter;
//XML的數據
public class AJAXXMLServer extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//response.setContentType("text/html;charset=utf-8");
response.setContentType("text/xml;charset=utf-8"); //修改此次為text/xml
PrintWriter out=response.getWriter();
//1.取參數
String old=request.getParameter("name");
StringBuffer sb=new StringBuffer();
sb.append("<message>");
//2.檢查是否有問題
if(old==null||old.length()==0){
sb.append("用戶名不能為空").append("</message>"); //拼裝XML
}else{
//3.校驗操作
String name=old;
if(name.equals("pan")){
//4.和傳統應用不同之處。這一步需要將用戶感興趣的數據返回給頁面端，而不是將一個新的頁面發送給用戶
//寫法沒有變，本質變瞭
sb.append("用戶名["+name+"]已經存在").append("</message>"); //拼裝XML
}else{
sb.append("用戶名["+name+"]可以使用").append("</message>"); //拼裝XML
}
}
out.println(sb.toString());//註意，此句一定不能少瞭，並且註意放置的位置
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doGet(request,response);
}
}
.修改web.xml
加入AJAXXMLServer類的配置
web.xml
_ 代碼如下:
<servlet>
<servlet-name>AJAXXMLServer</servlet-name>
<servlet-class>AJAXXMLServer</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>AJAXXMLServer</servlet-name>
<url-pattern>/AJAXXMLServer</url-pattern>
</servlet-mapping>
.修改verify.js文件
第一處：
_ 代碼如下:
把xmlhttp.open("GET","AJAXServer?name="+username,true);
改為
_ 代碼如下:
xmlhttp.open("GET","AJAXXMLServer?name="+username,true);//responseXML方式，修改類名
第二處：
把
responseText
_ 代碼如下:
//獲取服務器端返回的數據
//第一種方式：獲取服務器端輸出的純文本數據
//var responseText=xmlhttp.responseText;
//將數據顯示在頁面上 通過dom的方式找到p標簽對應的元素節點
//var pNode=document.getElementById("result");
//設置元素節點中的html的內容
//pNode.innerHTML=responseText;
改為：
responseXML
_ 代碼如下:
//第二種方式：使用responseXML的方式來接受XML數據對象的DOM對象
var domObj = xmlhttp.responseXML;
var messageNodes = domObj.getElementsByTagName("message");
//獲取message節點中的文本內容
//message標簽中的文本是在dom中是message標簽所對應的元素節點的子節點,firstChild可以獲取當前節點的第一個子節點
if (messageNodes.length > 0) {
var textNode = messageNodes[0].firstChild;
//對於文本節點來說，可以通過nodeValue的方式返回文本
var responseMessage = textNode.nodeValue;
//把值responseMessage顯示在p上
var pNode=document.getElementById("result");
pNode.innerHTML=responseMessage;
} else {
alert("XML數據格式錯誤，原始文本內容為：" + xmlhttp.responseText);
}
第三處：
把
text/html
_ 代碼如下:
if(xmlhttp.overrideMimeType){
xmlhttp.overrideMimeType("text/html");
}
改為：
text/xml
代碼如下:
if(xmlhttp.overrideMimeType){
xmlhttp.overrideMimeType("text/xml");//XML的方式時需要修改這個地方
}
對於IE瀏覽器如果第三處不修改不會報錯，但是對於firefox瀏覽器，如果此處不修改，以下語句會報錯
var domObj = xmlhttp.responseXML;
可以通過增加alert語句來驗證，IE瀏覽器的時候第三處修改的代碼的if語句不會被執行，firefox瀏覽器的時候這個if語句就會被執行
說明：訪問路徑、運行截圖與ajax學習筆記1中都是已經的，就省略瞭。
