Ajax的原生写法

简介: Ajax的原生写法
function ajax() {
  //创建一个 XHR 对象
  let oAjax = window.XMLHttpRequest ? (new XMLHttpRequest()) : (new window.ActiveXobject('Microsoft.XMLHTTP'));
  //返回一个函数,这是函数柯里化操作,不用每次调用 ajax 都判断浏览器环境
  //但是会占用更多的内存,因为总是会保存外部函数的作用域
  return function(url, fnSucc, fnFaild) {
    //只要 XHR 对象的 readyState 属性的值发生改变,就触发这个事件
    oAjax.onreadystatechange = function() {
      // readyState 属性是 0-4 的值,当为 4 时,表示已经接收到全部响应数据,并可以在客户端使用
      if (oAjax.readyState === 4) {
        //响应的 HTTP 状态
        let s = oAjax.status;
        if (s === 200 || s === 206 || s === 304) {
          //将响应主体被返回的文本作为参数传给这个函数,并执行这个函数
          if (fnSucc) fnSucc(oAjax.responseText);
        } else {
          if (fnFaild) fnFaild(oAjax.status);
        }
      }
    };
    //启动一个请求,准备发送
    oAjax.open('GET', url, true);
    //发送请求
    oAjax.send(null);
  }
}
相关文章
|
6月前
|
敏捷开发 JavaScript 前端开发
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
|
3月前
|
XML JSON 前端开发
AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
31 0
|
5月前
|
JavaScript 前端开发 安全
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
|
6月前
|
JSON 前端开发 JavaScript
JavaScript原生实现AJAX技术详解
【4月更文挑战第22天】本文详细介绍了使用原生JavaScript实现AJAX技术,包括基本原理和步骤。AJAX借助`XMLHttpRequest`对象实现异步通信,允许网页在不刷新情况下与服务器交换数据。文中提供示例展示了如何创建请求、设置回调函数、处理响应数据以及设置请求头和发送不同类型的数据。此外,还讨论了跨域问题及其解决方案,如CORS和JSONP。掌握这些基础知识对前端开发者至关重要,尽管现代框架提供了更高级的抽象。
|
6月前
|
JSON 前端开发 JavaScript
原生 AJAX 详解
原生 AJAX 详解
72 0
|
6月前
|
前端开发 JavaScript API
【uni-app】【基于jQuery Ajax】[sd.js]最新原生完整版for凯哥API版本
【uni-app】【基于jQuery Ajax】[sd.js]最新原生完整版for凯哥API版本
|
6月前
|
存储 移动开发 JavaScript
【原生】sd.js帮助您简化繁重的获取数据、存储数据(CRUD)骚操作(吐槽~在安卓9.0以下或者IOS10.X以下手机端H5页面不支持,在这两种情况下的系统只能使用ajax或者原生js请求后台数据)
【原生】sd.js帮助您简化繁重的获取数据、存储数据(CRUD)骚操作(吐槽~在安卓9.0以下或者IOS10.X以下手机端H5页面不支持,在这两种情况下的系统只能使用ajax或者原生js请求后台数据)
|
前端开发
一篇,让你会写原生ajax
一篇,让你会写原生ajax
49 0
|
JavaScript 前端开发
原生js实现ajax请求带请求头header
原生js实现ajax请求带请求头header
145 0
|
JavaScript 前端开发
js实现原生ajax
js实现原生ajax
211 0