JS完成Ajax请求

原生JS完成Ajax请求

自己写微信公众号页面的时候需要使用ajax请求，但是使用vue写的为了ajax请求导入JQuery影响加载速度就用原生的封装一个。

XMLHttpRequest

Ajax的核心 是XMLHttpRequest

1. 创建一个对象XMLHttpRequest

var XMLHttp = new XMLHttpRequest()

注意老版本的 IE（IE5 和 IE6）使用 ActiveX 对象

var XMLHttp = new ActiveXObject("Microsoft.XMLHTTP");

为了自适应浏览器，包括 IE低版本，先检查浏览器是否支持 XMLHttpRequest 对象。
如果支持，则创建 XMLHttpRequest 对象。
如果不支持，则创建ActiveXObject 。

var XMLHttp;
  if (window.XMLHttpRequest){
   
    // 目前主流阅览器
    XMLHttp =new XMLHttpRequest();
  } else {
   
    //IE低版本
    XMLHttp =new ActiveXObject("Microsoft.XMLHTTP");
  }

2. 向服务器发送请求

获取实例后向服务器发送请求，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法。

open(method,url,async)

规定请求的类型、URL 以及是否异步处理请求。

• method：请求的类型；GET 或 POST
• url：文件在服务器上的位置
• async：true（异步）或 false（同步）

send(string)

将请求发送到服务器。

• string：仅用于 POST 请求

XMLHttp.open("GET","www.baidu.com",true);
XMLHttp.send();

这里有几点问题：

使用GET 还是 POST

与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。
然而，在以下情况中，请使用 POST 请求：

• 无法使用缓存文件（更新服务器上的文件或数据库。GET请求的文件会缓存所以安全性不高。）
• 向服务器发送大量数据（POST 没有数据量限制。GET受阅览器地址影响有字符限制，不同阅览器不同。）
• 发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

GET 请求传参

XMLHttp.open(