您好,欢迎访问一九零五行业门户网

jquery ajax学习笔记2 使用XMLHttpRequest对象的responseXML_jquery

摘要:本节补充ajax学习笔记1中
第二种方式:使用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();
//2.检查是否有问题
if(old==null||old.length()==0){
sb.append(用户名不能为空).append(); //拼装xml
}else{
//3.校验操作
string name=old;
if(name.equals(pan)){
//4.和传统应用不同之处。这一步需要将用户感兴趣的数据返回给页面端,而不是将一个新的页面发送给用户
//写法没有变,本质变了
sb.append(用户名[+name+]已经存在).append(); //拼装xml
}else{
sb.append(用户名[+name+]可以使用).append(); //拼装xml
}
}
out.println(sb.tostring());//注意,此句一定不能少了,并且注意放置的位置
}
public void dopost(httpservletrequest request, httpservletresponse response)
throws servletexception, ioexception {
this.doget(request,response);
}
}
.修改web.xml
加入ajaxxmlserver类的配置
web.xml
复制代码 代码如下:
ajaxxmlserver
ajaxxmlserver
ajaxxmlserver
/ajaxxmlserver
.修改verify.js文件
第一处:
复制代码 代码如下:
把xmlhttp.open(get,ajaxserver?name=+username,true);
改为
复制代码 代码如下:
xmlhttp.open(get,ajaxxmlserver?name=+username,true);//responsexml方式,修改类名
第二处:

responsetext
复制代码 代码如下:
//获取服务器端返回的数据
//第一种方式:获取服务器端输出的纯文本数据
//var responsetext=xmlhttp.responsetext;
//将数据显示在页面上 通过dom的方式找到div标签对应的元素节点
//var divnode=document.getelementbyid(result);
//设置元素节点中的html的内容
//divnode.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显示在div上
var divnode=document.getelementbyid(result);
divnode.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中都是已经的,就省略了。
其它类似信息

推荐信息