Ajax前后端交互（1）

Ajax的四个步骤

第一步：创建Ajax对象

var xhr=window.XMLRequest();

但是这种方法ie8以下的浏览器是不能使用的，ie8以下的浏览器创建Ajax对象的方法是ActiveXObject(“Mircrosoft.XMLHTTP”)。我们可以通过以下方法来实现浏览器的兼容：

var xhr = null;
    try{
    xhr = new XMLHttpRequest();
    	}catch(error){
          	 xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }

第二步：调用open方法

xhr.open("参数1","参数2","参数3");
/*
参数1：传递数据所用的方式，主要使用的是两个POST/GET;
参数2：URL，指明数据要提交的目的地址
参数3：true（同步）/false（异步）
*/

第三步：调用send方法
POST和GET调用send()的方法的时候会有所不同；

//当“参数1==get”时，Ajax对象直接调用send()函数
xhr.send();

//当“参数2==post”时，Ajax对象在调用send（）函数之前还要设置请求的格式
xhr.setRequestHeader("content-type", "application/x-www-form-urlencoded");
//然后再调用send（）函数
xhr.send();

第四步：等待数据响应

xhr.onreadystatechange=function(){
if(xhr.readyState==4){
/*
readyState的值是有5个的，代表着程序运行的5个状态，这5个值分别代表
0.调用open()方法之前；
1.调用send()方法之后，发送请求
2.send()方法完成，已经接收到所有的响应内容
3.正在解析下载到的数据
4.解析完成
*/
  if(xhr.status==200){
  //这里的状态码等于200，代表的就是交易完成
  //另外一个比较重要的就是404，代表“没有发现文件、查询或者URL”
     alert(xhr.responseText);   
  }else{
         alert("错误:"+xhr.status);
        }                        
  }
}