原生js创建XMLhttpRequest对象

网站精华

您当前的位置是：主页专栏

原生js创建XMLhttpRequest对象

【社区流浪汉】 2021-01-29 447次围观 0条评论

简介原生javascript封装通用的xhr对象，兼容各个版本.

// 封装通用的xhr对象，兼容各个版本  function createXHR(){    // 判断浏览器是否将XMLHttpRequest作为本地对象实现，针对IE8    if (typeof XMLHttpRequest != 'undefined') {      return new XMLHttpRequest();    } else if (typeof ActiveXObject != 'undefined') {      // 将所有可能出现的ActiveXObject版本放在一个数组中      var xhrArr = ['Microsoft.XMLHTTP', 'MSXML2.XMLHTTP.6.0', 'MSXML2.XMLHTTP.5.0', 'MSXML2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP.4.0'];      // 遍历创建XMLHttpRequest对象      var len = xhrArr.length, xhr;      for(let i = 0; i < len; i++) {        try{          // 创建XMLHttpRequest对象          xhr = new ActiveXObject(xhrArr[i]);          break;        }catch(err){          console.log(err);        }      }      return xhr;    } else {      throw new Error('No XHR object availabel!')    }  } // XMLHttpRequest对象 var xhr = createXHR(), data; // 响应XMLHttpRequest对象状态变化的函数，OnreadyStatechange在readyState属性发生改变时触发 xhr.onreadystatechange = function () { // 响应内容解析完成，可以在客户端调用 if (xhr.readyState == 4) { // 异步调用成功, 304表示请求资源没有改变 if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) { // 获得服务器返回的数据。 console.log(JSON.parse(xhr.responseText)) data = JSON.parse(xhr.responseText) // 渲染数据到页面中 renderDataToDom(); } } } // 创建请求 xhr.open("GET", "http://106.55.147.49:12005/public/list", true); // 发送请求 xhr.send({user: "zhangsan", id: 6}) xhr.send(null); // 设置http头部信息 // xhr.setRequestHeader("Content-type", "application/x-wwww-form-urlencoded");

转载：

喜欢 3

上一篇： Event对象跨浏览器兼容事件

下一篇： Javascript字符串Split方法分割字符串并去除空值

相关文章

文章推荐

原生js创建XMLhttpRequest对象

乐视官方确认还有 400 多人：消息称员工“没有内卷和 996”，过着“没有老板”的神仙日子

HTML 面试知识点总结

眼镜试戴的装饰效果

Node 配置sequelize + mysql，根据模型自动创建数据库表