ajax的异步请求（javascript和xml）实现方式

一、ajax：(asynchronous javascript and xml)异步的javascript和xml

1.使用到js和xml
2.实现异步

ajax就是使用js实现异步请求和局部刷新的,而xml是ajax和服务器交互的
一种数据格式(还有字符串文件 json)。

异步交互和同步交互:

1.同步交互:

1>浏览器向服务器发起一个请求,就要等待服务器给浏览器响应结束后,
然后浏览器才能向服务器发起第二个请求,中间这段时间只能等待。
2>刷新的话也是整个页面,也就是说服务器向浏览器响应的是整个html页面

1>客户端向服务器发送的是同步请求
2>服务器向浏览器做出的是全局刷新(对整个页面都进行了刷新)

2.异步交互:

1>浏览器向服务器发起一个请求后,无需等待服务器的响应,浏览器就可以
向服务器再发起第二个请求。
2>可以对页面的局部内容进行刷新,就是可以使用javascript接收服务器的
响应数据,然后使用javascript对页面的局部内容进行刷新,页面的其它
内容不变。

1>浏览器向服务器发出的请求是异步请求(靠的也是js)
2>ajax可以使用js接收到服务器响应的数据并对页面只做局部刷新

二、ajax的特点:

1>ajax能使用javascript请求服务器,而且是异步请求。
2>服务器向浏览器一般响应的是整个页面,即一个完整的html页面。
而ajax可以使用javascript接收服务器的响应数据,并使用javascript对
页面做局部刷新。

ajax:是异步请求和局部刷新
1>使用js进行异步请求
使用javascript请求服务器,而且是异步请求。
2>也是使用js对页面进行局部刷新
javascript接收服务器的响应数据,并使用javascript对
页面做局部刷新

3>ajax可接收的服务器响应的数据的类型:
1>text:字符出串文本
2>xml
3>json:js提供的数据格式(ajax中使用最多)。

三、ajax的应用场景:
1>表单校验
2>百度搜索引擎

四、ajax的操作步骤:

1.第一步:得到XMLHttpRequest对象:
ajax主要就是通过XMLHttpRequest对象来实现异步交互的。
得到XMLHttpRequest对象对于不同的浏览器的方式是不一样的：
1>大多数浏览器都支持：
var xmlHttp = new XMLHttpRequest();
2>IE6.0:
var xmlHttp = new ActiveXObject(“Msxml2.XMLHTTP”);
3>IE5.5以及更早版本的IE：
var xmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”);

2.第二步:调用XMLHttpRequest对象的open()方法打开与服务器的连接:
xmlHttp.open();
1>参数一：请求方式，get或post。
2>参数二：请求的URL地址，即请求的服务器资源。
3>参数三：请求是否为异步，true表示发送异步请求，false表示发送同步请求。
xmlHttp.open(“GET” , “/ajaxTest/ServletA” , true);

(3).如果是post请求,还需调用xmlHttp对象的setRequestHeader()方法,设置请求头:
Content-Type,值是application/x-www-form-urlencoded,告诉服务器浏览器使
用url编码传递的数据
xmlHttp.setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”);

4.第三步:调用XMLHttpRequest对象的send()方法发送请求：
xmlHttp.send();
当是post请求方式时，参数就是请求体内容;
而当是get请求方式，参数必须是null，且在open()方法的参数url地址之后连接上参数;
如果post和get请求方式都没有请求参数，则也为null。

5.第四步:在XMLHttpRequest对象的onreadystatechange事件上注册监听器，
获取XMLHttpRequest对象的状态和服务器的响应状态码并进行判断，进
而获取服务器的响应数据。
onreadystatechange事件是当XMLHttpRequest对象的状态发生变化时被触发的。

1>得到XMLHttpRequest对象的状态:
var state = xmlHttp.readyState ;
1) 0状态:初始化未完成状态。只是创建了XMLHttpRequest对象，还未调用open()方法。
2) 1状态:请求已开始。open()方法调用了，还没有调用send()方法。
3) 2状态:请求发送完整状态。send()方法也已经调用了。
4) 3状态:开始读取服务器响应，但服务器响应未结束。
5) 4状态:读取服务器响应结束。(合法状态)

2>得到服务器响应的状态码:
var status = xmlHttp.status ;
(合法状态码200)
3>得到服务器的响应数据:
1)得到服务器响应的文本格式的内容：
var content = xmlHttp.responseText ;
2)得到服务器响应的xml格式的内容,且返回的是将xml文本进行封装的Document对象:
var content = xmlHttp.responseXML;

五、获取服务器响应数据的XML文本:
1、服务器端：
设置响应头:Content-Type,值为:text/xml;charset=utf-8
告诉浏览器服务器响应的正文为xml文本,以及响应数据的编码格式为utf-8
2、客户端：
通过xmlHttp对象的responseXML属性获取响应数据,且返回值是封装了xml文档的
document对象:
var doc = xmlHttp.responseXML;

                                "<stus>" +
                   "<stu sno='101'>"+
                      "<name>张三</name>"+
                      "<age>20</age>"+
                   "</stu>"+
                 "</stus>";


  浏览器判断:
  window对象的addEventListener事件的值为false表示是IE浏览器,值为
  true表示是其他浏览器。

XStream技术:
1、作用:
把javaBean转换成(序列化)xml格式字符串

2、所需jar包:
xstream-1.4.7.jar、xpp3_min-1.1.4c.jar

3、操作步骤：
1>创建XStream对象:XStream xs = new XStream();
2>将指定javaBean转成xml字符串:String str = xs.toXML(javaBean);

4、其它方法：
1>将生成的xml中指定类型对应生成的标签名进行修改:
xs.alias(“china” , List.class);将List类型生成的标签名改为china
xs.alias(“province” , Province.class);将Province类型生成的标签名改为province

  2>类的成员默认生成的是类对应标签的子标签,让类的成员生成类对应生成标签的属性:
    xs.useAttributeFor(Province.class , "name");
    把Province类的name成员属性,修改生成Province类生成的标签<province>的name属性,
而不是Province类生成的标签<province>的子标签<name>

  3>当javaBean的成员是Collection集合时,只需要将Collection集合的内容生成标签,而   
    Collection集合不生成标签:
    xs.addImplicitCollection(Province.class , "cities");
    让Province类的成员List集合cities不生成标签,只让cities集合的内容生成标签

  4>让指定类的成员不生成标签:
    xs.omitField(City.class , "description");
   让City类的成员description不生成标签