1）获取（创建）Ajax对象：获取XMLHttpRequest对象

2）创建请求：调用xhr的open方法

3）在发送请求之前需要设置回调函数：绑定指定xhr的onreadystatechange事件

4）调用send()方法发送请求

 

//创建XMLHttpReuquest 对象 function createXhr() {
       var xhr = null;     //浏览器判断     if (window.XMLHttpRequest) {
           //可以直接new出来对象的说明是IE7、8、9 Chrome、FireFox等浏览器         xhr = new XMLHttpRequest();     } else {
           //这样的就是IE 5.5、 IE 6等低版本的浏览器         xhr = new ActiveXObject("Microsoft.XMLHttp");     }     return xhr; }

//创建异步请求方法get function getServerText() {
       //获取xhr     var xhr = createXhr();     //创建请求     xhr.open("get", "server.php", "true");//true表示异步请求     //设置回调函数     xhr.onreadystatechange = function () {
           if (xhr.readyState == 4 && xhr.status == 200) {
               //服务器已经正确处理请求且正确响应数据到客户端             var resText = xhr.responseText;//返回服务器响应文本             //获取服务器响应给客户端的文本即server.php中的文本内容             document.getElementById("showText").innerHTML = resText;         }     }     //发送请求     xhr.send(null);//请求方式为get,所以请求体必须是null } 实例：模拟服务器发送请求

    ajax提交数据(get方法)：

   $(document),ready(function(){

 　　$("#txtName").blur(function(){

　　1）获取xhr

　　var xhr =createxhr();

　　2）创建请求

　　var name = $("#txtName").val();

　　var url = "checkname.jsp?name="+name;

　　xhr.open("get",url,true);

　　3）设置回调函数 　　xhr.onreadystatechange = function(){

　　if(xhr.readyState==4 && xhr.status==200){

　　//服务器已经正确处理请求且正确响应数据到客户端

 　　var resText= xhr.responseText;//返回服务器响应文 本

　　$("#txtNameTip").html(resText);//获取响应回来的 数据

　　　　 }

　　}

　　4）发送请求

　　xhr.send (null);//get发送请求的方法

　　　　});

　　});

//创建异步请求方法post

        $(document),ready(function(){

　　　　$("#txtName").blur(function(){

　　1）获取xhr

　　　　var xhr =createxhr();

　　2）创建请求

　　　　var name = $("#txtName").val();

　　　　var url = "checkname.jsp";

　　　　xhr.open("post",url,true);

　   　xhr.setRequestHeader("Content-Type","application/x-www- form-urlencoded");

3）设置回调函数

xhr.onreadystatechange = function(){

if(xhr.readyState==4 && xhr.status==200){ //注意顺序

//服务器已经正确处理请求且正确响应数据到客户端

var resText= xhr.responseText;//返回服务器响应文

本

$("#txtNameTip").html(resText);//获取响应回来的

数据

}

}

4）发送请求

xhr.send ("name="+name);//Post方法发送方法

注意：必须在创建请求之后，发送请求之前使用setRequestHeader

()显示更改Content-Type消息头的值为

application/x-www-form-urlencoded ，否则获取不到传递过去的

数据

})

});