現在我們使用各種框架提供的ajax請求，很方便的請求後臺介面，但是原生js的http請求一定不能丟

原生js中實現http主要通過XMLHttpRequest物件,關鍵方法是open()和send（）

 get請求

get請求主要用途是向伺服器請求我們需要的資料，如下，我們發起一個get請求，傳遞兩個引數name和age

引數直接拼接在url後面

var ajax=new XMLHttpRequest();
ajax.open('get','/project/getProjectList.do?name=1&age=1');
ajax.send();

ajax.onreadystatechange=function
 
(){
  if(ajax.readyState==4&&ajax.status==200|| ajax.status==304){
    console.log(ajax.responseText);
}
}

post請求

post請求一般用於向伺服器提交資料

var data={name:1,age:1};
var ajax=new XMLHttpRequest();
ajax.open('post','/project/getProjectList.do');
ajax.setReuqestHeader('Content-type','application/x-www-form-urlencoded'
 
);
ajax.send(JSON.stringify(data));
ajax.onreadystatechange=function(){
  if(ajax.readyState==4&&ajax.status==200|| ajax.status==304){
    console.log(ajax.responseText);
}
}

一個封裝的ajax請求

function ajaxMethod(method, url, data, sucess) {
  var ajax = new XMLHttpRequest();
if (method === 'get') {
    if 
 
(data) {
      url += '?';
url += data;
}
    ajax.open(method, url);
ajax.send();
} else {
    ajax.open(method, url);
ajax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
if (data) {
      ajax.send(data);
}
    ajax.send();
}
  ajax.onreadystatechange = function () {
    if (ajax.readyState === 4 && ajax.status === 200 || ajax.status===304) {
      sucess(ajax.responseText);
}
  }
}