AJAX

XmlHttp是什么？
最通用的定义为：XmlHttp是一套可以在Javascript、VbScript、Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API。XmlHttp最大的用处是可以更新网页的部分内容而不需要刷新整个页面。
来自MSDN的解释：XmlHttp提供客户端同http服务器通讯的协议。客户端可以通过XmlHttp对象(MSXML2.XMLHTTP.3.0)向http服务器发送请求并使用微软XML文档对象模型Microsoft® XML Document Object Model (DOM)处理回应。 

现在的绝对多数浏览器都增加了对XmlHttp的支持，IE中使用ActiveXObject方式创建XmlHttp对象，其他浏览器如：Firefox、Opera等通过window.XMLHttpRequest来创建xmlhttp对象。 

XmlHttp对象参考：
属性：
onreadystatechange* 指定当readyState属性改变时的事件处理句柄。只写 
readyState  返回当前请求的状态，只读. 
responseBody  将回应信息正文以unsigned byte数组形式返回.只读 
responseStream 以Ado Stream对象的形式返回响应信息。只读 
responseText 将响应信息作为字符串返回.只读 
responseXML 将响应信息格式化为Xml Document对象并返回，只读 
status 返回当前请求的http状态码.只读 
statusText  返回当前请求的响应行状态，只读 

方法：
abort 取消当前请求 
getAllResponseHeaders 获取响应的所有http头 
getResponseHeader 从响应信息中获取指定的http头 
open 创建一个新的http请求，并指定此请求的方法、URL以及验证信息(用户名/密码) 
send 发送请求到http服务器并接收回应 
setRequestHeader 单独指定请求的某个http头 

AJAX学习

1.创建对象 variable=new XMLHttpRequest()  新版本
 variable=new ActiveXObject("Microsoft.XMLHTTP");老版本 

2.请求 XMLHTTP.open("GET/POST","url文件在服务器上的位置","true同步/false异步")
       XMLHTTP.send()

 POST的使用
无法使用缓存文件（更新服务器上的文件或数据库）
向服务器发送大量数据（POST 没有数据量限制）
发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

3.响应
responseText   获得字符串形式的响应数据
responseXML    获得 XML 形式的响应数据

4.readyState
readyState
存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪

status
200: "OK"
404: 未找到页面

AJAX实例

<script>
function loadXMLDoc()
{
    var xmlhttp;
    if (window.XMLHttpRequest)
    {
        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlhttp=new XMLHttpRequest();
    }
    else
    {
        // IE6, IE5 浏览器执行代码
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }else{
　　　　　　　　}
    }
    xmlhttp.open("GET","/try/ajax/ajax_info.txt",true);
    xmlhttp.send();
}
</script>

AJAX封装

function ajax(options){
  var xhr = null;
  var params = formsParams(options.data);
  if(window.XMLHttpRequest){
     xhr = new XMLHttpRequest()    
    } else {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
      }  
  if(options.type == "GET"){
      xhr.open(options.type,options.url + "?"+ params,options.async); 
      xhr.send(null)    
    } else if(options.type == "POST"){
      xhr.open(options.type,options.url,options.async); 
      xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
      xhr.send(params);
      }   
xhr.onreadystatechange = function(){    
    if(xmlhttp.readyState==4){
          if(xmlhttp.status==200||xmlhttp.status==304){
            options.success(xhr.responseText);
          }
        }
  } 
}   
function formsParams(data){  
  var arr = [];   
  for(var prop in data){  
    arr.push(prop + "=" + data[prop]);    
  }        
  return arr.join("&"); 
}