ajax原生js版

判断浏览器是否支持

 var xmlHttp;
  if(window.XMLHttpRequest){
    //(包括IE7/8/9)firefox chrome浏览器支持，IE6不支持
     alert("标准写法(仅IE6不支持)");    }
  if(window.ActiveXObject){
    //IE所有浏览器支持
   alert("所有IE支持，IE6只支持这种写法");
   }

新建ajax

—支持IE6/7/8/9/10 firefox chrome
   var xmlHttp;
   if(window.XMLHttpRequest){
//标准创建方式
     xmlHttp=new XMLHttpRequest();
  }else {
//IE6创建方式
     xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
   }

ajax对象的方法

1. open方法
   用于设置进行异步请求的目标URL，请求方法及其他参数信息
   语法: open(“method”,”url”[,asyncFlag]);
   参数说明:
   • method--方法get/post
   • url—请求指定地址，并且可以传递查询字符串
   • asyncFlag—可选参数，用于指定请求方式,默认为true
     • 当该boolean值为true时，服务器请求是异步进行的，也就是脚本执行send（）方法后不等待服务器的执行结果，而是继续执行脚本代码；
     • 当该boolean值为false时，服务器请求是同步进行的，也就是脚本执行send（）方法后等待服务器的执行结果的返回，若在等待过程中超时，则不再等待，继续执行后面的脚本代码！
2. setRequestHeader方法:
   为请求的HTTP头设置值。
   语法:
   setRequestHeader(“label”,”value”);
   实例:setRequestHeader(“Content-type”,”application/x-www-form-urlencoded”);
   注意:setRequestHeader()方法必须在调用open方法之后才能调用
3. send方法:
   用于向服务器发送请求，如果请求声明为异步，则该方法将立即返回，否则将等到接收到响应为止
   语法: send([数据])；

Ajax对象详解

1. Ajax对象事件onreadystatechange
   当请求被发送到服务器时，我们需要执行一些基于响应的任务。每当 readyState属性改变时，就会触发 onreadystatechange 事件。
   readyState 属性存有 XMLHttpRequest 的状态信息 readyState存储 XMLHttpRequest 的状态。

从 0 到 4 发生变化。
0: 请求未初始化（还没有调用 open()）
1: 服务器连接已建立，但是还没有发送（还没有调用 send()）
2: 请求已接收，正在处理中（通常现在可以从响应中获取内容头）
3: 请求处理中,通常响应中已有部分数据可用了，但是服务器还没有完成响应的生成。
4: 请求已完成，且响应已就绪，您可以获取并使用服务器的响应了。

2. Ajax对象详解—Ajax对象属性
   responseText 获取服务器端字符串形式数据（包括字符串形式json数据）
   responseXML获取服务器端XML形式数据