Ajax异步请求步骤和代码

构建异步请求的四步曲：AJAX实例解析

最新推荐文章于 2023-03-04 19:37:32 发布

原创最新推荐文章于 2023-03-04 19:37:32 发布 · 264 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

web前端专栏收录该内容

25 篇文章

订阅专栏

本文详细介绍了如何通过四个步骤实现异步请求，包括创建XMLHttpRequest对象、设置请求方法和URL、发送数据，并监听服务器响应。通过实例代码展示了如何在请求成功和失败时处理结果。

一道面试题

建立异步请求过程的4个步骤：

a：new一个XHR对象
b：调用open方法
c：send一些数据
d：对过程进行监听，来知道服务器是不是正确地做出了响应，接着可以做一些事情

例子代码：

var xhr = new XMLHttpRequest();//new一个XHR对象

//XMLHttpRequest 的 onload 和 onerror 属性都是函数，分别在它请求成功和请求失败时被调用。
xhr.onload = function () {
    // 输出接收到的文字数据
    document.getElementById("demo").innerHTML=xhr.responseText;
}
xhr.onerror = function () {
    document.getElementById("demo").innerHTML="请求出错";
}

// 发送异步 GET 请求
xhr.open("GET", "https://www.runoob.com/try/ajax/ajax_info.txt", true);//调用open方法
xhr.send();//send数据