ajax学习

1、废话不多说，直接上代码演示：创建基本的ajax的get请求的原生js代码。

var XHR;
if (window.XMLHttpRequest) {
    //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
  XHR = new XMLHttpRequest();
} else {
  // IE6, IE5 浏览器执行代码
  XHR = new ActiveXObject('Microsoft.XMLHTTP');
}
// var XHR = new XMLHttpRequest();// 创建ajax对象
XHR.open('get', 'url', true);
XHR.send();
XHR.onreadystatechange = function (params) {
  if (XHR.readyState === 4 && XHR.status === 200) {
    var json = XHR.responseText;
    console.log(json);
  }
};

创建基本的ajax的post请求的原生js代码，注意post请求需要设置请求头信息

if (window.XMLHttpRequest) {
    //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
  XHR = new XMLHttpRequest();
} else {
  // IE6, IE5 浏览器执行代码
  XHR = new ActiveXObject('Microsoft.XMLHTTP');
}
XHR.open('post', 'url', true);
XHR.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');// post方式需要设置请求头信息
XHR.send('name=yangwei');
XHR.onreadystatechange = function () {
  if (XHR.readyState === 4 && XHR.status === 200) {
    var json = XHR.responseText;
    console.log(json);
  }
};

axios发送ajax请求：

Axios.get('url', {
  params1: '',
  params2: ''
}).then((response) => {
  console.log(response);
})
  .catch((error) => {
    console.log(error);
  });

另一种写法：

Axios({
  method: 'post/get',
  url: 'url',
  data: {
    params1: '',
    params2: ''
  }
}).then((response) => {
  console.log(response);
})
  .catch((error) => {
    console.log(error);
  });