Ajax用法总结

ajax：

     AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。

     AJAX = 异步 JavaScript和XML（标准通用标记语言的子集）。 AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 AJAX）如果需要更新内容，必须重载整个网页页面。（来自百度百科）。

 

Ajax快速入门:

1.创建XMLHttpRequest对象

2.将状态触发器绑定到一个函数

3.使用open方法建立与服务器的连接

4.向服务器端发送数据

5.在回调函数中对返回数据进行处理

1.创建XMLHttpRequest对象:

不同浏览器提供不同的支持，IE浏览器 new ActiveXObject("Msxml2.XMLHTTP")，new new ActiveXObject("Microsoft.XMLHTTP")，其它浏览器（火狐） new XMLHttpRequest();

XMLHttpRequest的方法：

open(method,url, asynch) ：建立对服务器的调用

send(content) ：向服务器发送请求

XMLHttpRequest的属性：

　　　　onreadystatechange ：状态回调函数

　　　　responseText/responseXML ：服务器的响应字符串

　　　　status：服务器返回的HTTP状态码（200 =请求成功；404=请求失败......）

　　　　statusText: 服务器返回的HTTP状态信息

　　　　readyState ：对象状态（0 = 未初始化；1 = 正在加载；2 = 已加载；3 = 交互中；4 = 完成）

一般都只用找到文档上代码复制代码就OK：

var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

2.将状态触发器绑定到一个函数：

xmlHttp.onreadystatechange = processor; 这里的processor是回调函数的方法名，当对象状态发生改变时，就会触发回调函数，触发回调函数这里当做最后一步。

xmlHttp.onreadystatechange = processor;
 function processor (){
      … …
 }

3.使用open方法建立与服务器的连接：

open(method,url, asynch) 其中method表示HTTP调用方法，一般使用"GET"，"POST"； url表示调用的服务器的地址 ； asynch表示是否采用异步方式，true表示异步，一般这个参数不写。

xmlHttp.open("POST", "url");
xmlHttp.open("GET", "url?name=xxx&pwd=xxx");//get提交方式，url后面可以带参数，post提交方式参数放在接下来要讲的send方法里面

 4.向服务器端发送数据：

        用get提交方式：

//3.使用open方法建立与服务器的连接
xmlhttp.open("GET","url?name=xxx&pwd=xxx"); 
//4.发送请求
 send xmlhttp.send(null);

用post提交方式：

//3.使用open方法建立与服务器的连接
xmlhttp.open("POST",URL);    

xmlhttp.setRequestHeader("content-type","application/x-www-form-urlencoded");//设置请求头,这个在post提交方法中要多写的代码    

//4.发送请求
xmlhttp.send("name=xxx&pwd=xxx");

5.在回调函数中对返回数据进行处理：

//2.将状态触发器绑定到一个函数
xmlhttp.onreadystatechange= processor;

 function  processor(){ 
　　　　　　//5.处理响应数据 当信息全部返回，并且是成功 
　　　　　　if(xmlhttp.readyState==4&&xmlhttp.status==200){
 　　　　　　　  
          }
 };

一个完整的例子：

    //第一步:得到XMLHttpRequest对象.
    var xmlhttp = null;

    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest(); //针对于现在的浏览器包括IE7以上版本
    } else if (window.ActiveXObject) {
        //针对于IE5,IE6版本
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    //2.设置回调函数
    xmlhttp.onreadystatechange=function(){

        //5.处理响应数据  当信息全部返回，并且是成功
        if(xmlhttp.readyState==4&&xmlhttp.status==200){

            alert(xmlhttp.responseText);
        }
    };

    //3.open
    xmlhttp.open("GET",URL);

    //4.发送请求 send
    xmlhttp.send(null);