AJAX概述和简单使用

一.ajax概述：
asynchronous javascript and xml ,用于异步的向服务器发出请求，接收数据的
一种技术。
在整个过程中：页面无刷新，不打断用户的操作；
              按需要获取数据，数据传输量大大减少；
              是一种标准化的东西，不需要任何插件。

二.ajax对象的属性：
    .onreadystatechange：绑定一个事件处理函数，该函数用来处理readystatechange
    事件，ajax对象的readyState属性发生变化，就会产生onreadystatechange事件；
    .responseText：获得服务器返回的文本数据；
    .responseXML：获得服务器返回的XML文档；
    .status：获得状态码；
    .readystate：返回Ajax对象与服务器通讯的状态，返回值是一个number类型的值。
    ）：（未初始化）对象已建立，但是尚未初始化（未调用open方法）。
    ）：（初始化）对象已建立，尚未调用send方法。
    ）：（发送数据）send方法已调用。
    ）：（数据传送中）已接收部分数据。
    ）：（响应结束）AJax对象已经获取了服务器返回的所有数据。

三.页面编程步骤
get请求
.获取ajax对象：
function getxhr（）{
    var xhr = null;
    if(window.XMLHttpRequest){
        xmr = new XMLHttpRequest();  //非IE浏览器
    }else{
        xmr = new ActiveXObject("Microsoft.XMLHttp“);  //IE浏览器
    }
}
//依据id返回dom节点
function $(id){
    retutn document.getElementById(id);
}
//返回id对应的值
function $F(id){
    return $(id).value;
}
.使用ajax对象发送请求:
    ()建立lianjie：请求方式，请求资源路径，请求是同步还是异步
    xhr.open("get","check_username.do?username=chang&age=23,true");
    ().编写处理函数：
    xhr.onreadystatechange=function(){
        if(xhr.readyState==){        //服务器响应结束
            if(xhr.status==){    //服务器返回了正确的结果
                //处理代码
            }else{
                //出现异常
            }
        }
    }
    ().发送请求参数：
    xhr.send(null);

post请求
.获取ajax对象
function getxhr（）{
    var xhr = null;
    if(window.XMLHttpRequest){
        xmr = new XMLHttpRequest();  //非IE浏览器
    }else{
        xmr = new ActiveXObject("Microsoft.XMLHttp“);  //IE浏览器
    }
}
.使用ajax对象发送请求
    ().建立连接：
    xhr("post","check_username",true);
    ()发送一个请求头：
    xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");
    ()编写处理函数：
    xhr.onreadystatechange=function(){
        if(xhr.readyState==){        //服务器响应结束
            if(xhr.status==){    //服务器返回了正确的结果
                //处理代码
            }else{
                //出现异常
            }
        }
    }
    ()发送请求参数：
    xhr.send("username=chang");

四.乱码问题：
    产生原因：
    IE浏览器的内置Ajax对象会使用“GBK”，其他浏览器会使用“utf-”对中文参数进行
    编码，服务器端默认使用“ISO--”去解码，所以会出现乱码问题。
    解决：
    .设置服务器使用的字符集，在Tomcat的server.xml文件中配置URLEncoding=“utf-”；
    （和8080在一起的那一个connector）
    .使用encodeURL()函数（js的内置函数）对请求地址进行编码。
五.缓存问题：
    当发送get请求时，IE浏览器会检查请求地址是否访问过，如果访问过，就不会向
    服务器发送请求了。
    解决：
    .在请求地址后面添加一个随机数参数，欺骗IE。
        xhr.open("get","getNumber.do?"+Math.random(),true);
    .使用post请求发送。