原生ajax实现get和post请求

执行步骤

1.1 xhr.open(method,url,isAsync);
注：这行代码只是在预备发送请求，而不是真正的发送请求。url可以使用相对或者绝对路径。
1.2 xhr.send(data);
注：即使不发送data,也要填写null,因为兼容性问题某些浏览器可能报错。
1.3 xhr.onreadystatuschange(); readystatus一共可以取得以下值：

    0：未初始化，没有调用open() 
    1: 启动。调用open() 
    2: 发送。 调用send(),无返回的响应。 
    3: 接受。 接受返回的部分数据。 
    4: 完成。数据接收完成可以使用。

    注意：该方法必须在xhr.open()之前调用，以保证正确运行。

代码实现

2.1 这里的代码考虑到IE低版本不支持XMLHttpRequest，如果不需要支持IE10以及以下版本就可以不用这么麻烦，直接使用XMLHttpRequest就可以了 。
2.2 另外注意open() 和setRequestHeader()以及send()三者的先后顺序。
2.3 至于get请求就容易多了，修改一下xhr.open()以及xhr.setRequestHeader()就可以了，其他的没什么变化。

function createXHR() {
  if (typeof XMLHttpRequest != "undefined") {
    return new XMLHttpRequest();
  } else if (typeof arguments.callee.activeXString !== "string") {
    var vers= ["MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp"],i,len;
    for (i=0,len=vers.length;i<vers;i++) {
      try {
        new ActiveXObject(vers[i]);
        arguments.callee.activeXString = vers[i];
        break;
      }catch(err){
        console.log(err);
      }
    }
    return new ActiveXObject(arguments.callee.activeXString);
  } else {
    throw new Error("No XHR object available");
  }
}
function submitData() {
    var xhr = createXHR();
    xhr.onreadystatchange = function () {
        if (xhr.readyStatus === 4){
          if ((xhr.status >= 200 && xhr.status<300) || xhr.status === 304 ){
              console.log(xhr.statusText);
          } else {
              console.log("request is failed:"+xhr.status);
          }
        }
    }
    xhr.open("post", url, true);
    xhr.timeout = 1000; //设置超时时间
    xhr.ontimeout = function () {
        console.log("Request is timeout");
    }
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    var form =new FormData();
    xhr.send(JSON.stringify(form));
}
// 注意 open() 和setRequestHeader()以及send()三者的先后顺序。