发起请求并处理响应：`XHR` 与 `axios` 使用指南来啦[特殊字符]~

又又又要长脑子呐~ 了解到通过发起HTTP请求并在不刷新页面的情况下更新页面内容是一种常见的需求。学习使用XMLHttpRequest 或 axios 来实现，现在进行对比两者，比较项目使用时候的优缺点，文末使用表格进行对比学习

1. 使用 XHR 实现

下面是一个使用 XMLHttpRequest 发起GET请求并处理服务器响应的示例：

html 体验AI代码助手 代码解读复制代码    <p class="my-p">p>
    <script>
        // 创建一个新的 XMLHttpRequest 对象
        const xhr = new XMLHttpRequest();
        
        // 配置请求
        xhr.open('GET', 'http://hmajax.itheima.net/api/province');
        
        // 监听 loadend 事件，无论成功还是失败都会触发
        xhr.addEventListener('loadend', () => {
     
            if (xhr.readyState === 4 && xhr.status === 200) {
     
                try {
     
                    // 将响应字符串解析为 JSON 对象
                    const data = JSON.parse(xhr.response);
                    console.log(data); // 打印整个响应数据
                    document.querySelector('.my-p').innerHTML = data.list.join(