深入掌握Ajax + Promise + Async + await 异步解决方案

最新推荐文章于 2024-06-23 11:29:02 发布

无糖气泡

最新推荐文章于 2024-06-23 11:29:02 发布

阅读量1.1k

点赞数 2

分类专栏： JavaScript 文章标签： ajax javascript html

本文链接：https://blog.youkuaiyun.com/qq_47969241/article/details/120525361

版权

随着前端技术的不断更替，Ajax在整个JavaScript以及整个前端发展史都占据非常重要的地位，那么什么是Ajax? AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术，并不是一个新的编程语言喔！它是属于JavaScript网络请求模块的一部分。

传统回调函数会造成回调地域问题，类似不同的异步函数相互嵌套，导致加重寻找bug的难度和代码的美观度的减少。

那么这一次我们就来做一次对Ajax使用的深入透析。

首先我们先来看看我们的文件目录:

json文件夹下有个静态资源文件，同时我们也要用一个接口去请求线上的数据。

使用Ajax 我们首先就要创建Ajax对象


        var btn = document.querySelector("button");
        var btn_ = document.getElementById("btn")
        let xhr = new XMLHttpRequest();
        if (window.XMLHttpRequest) {
            xhr = new XMLHttpRequest()
        } else {
            xhr = new ActiveXObject('')
        }

上面是兼容性创建Ajax请求对象，两个按钮分别触发不同异步请求方案