白骑士的JavaScript教学进阶篇之浏览器API 3.4.2 异步请求（XMLHttpRequest, Fetch API）

        在浏览器环境中，JavaScript 的强大功能之一是能够发起异步请求，从而与服务器进行数据交互，而不需要刷新整个页面。异步请求是现代网页应用中必不可少的一部分，通常用于动态加载数据、提交表单或与外部 API 进行交互。在本节中，我们将介绍 JavaScript 中常用的两种异步请求方式：‘XMLHttpRequest‘ 和 ‘Fetch API‘。

‘XMLHttpRequest‘

        ‘XMLHttpRequest‘（简称 ‘XHR‘）是浏览器中用于与服务器进行交互的传统 API。尽管它的名称中包含 “XML”，但实际上它可以处理多种格式的数据，包括 JSON、HTML 和纯文本等。

基本用法

        以下是使用 ‘XMLHttpRequest‘ 发送 GET 请求的基本步骤：

let xhr = new XMLHttpRequest();

xhr.open("GET", "https://api.example.com/data", true);

xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
        console.log(xhr.responseText); // 输出服务器响应内容
    }
};

xhr.send();

        代码解释：

• ‘XMLHttpRequest‘ 对象用于创建请求。
• ‘open‘ 方法设置请求的类型（GET 或 POST）、URL 和是否异步（true）。
• ‘onreadystatechange‘ 是一个事件处理函数，当请求的状态发生变化时被调用。‘readyState‘ 为 4 且 ‘status‘ 为 200 时表示请求成功并接收到了响应。
• ‘send‘ 方法发送请求到服务器。

处理 POST 请求

        使用 ‘XMLHttpRequest‘ 发送 POST 请求时，可以将数据作为请求体发送：

let xhr = new XMLHttpRequest();

xhr.open("POST", "https://api.example.com/submit", true);
xhr.setRequ