AJAX原理

AJAX使用XHR 对象和服务器进行数据交互

XHR

javascript 复制代码
 <p class="my-p"></p>

    <script>
        const xhr = new XMLHttpRequest()
        xhr.open(`GET`,`http://hmajax.itheima.net/api/province`)
        xhr.addEventListener(`loadend`,()=>{
            // console.log(xhr.response)
            const data = JSON.parse(xhr.response)
            const myp = document.querySelector(`.my-p`)
            myp.innerHTML =  data.list.join(`<br>`)
        })

        xhr.send()
        
    </script>

XHR查询参数

新API URLSearchParams

XHR 提交数据

将上传数据通过JSON.stringify()方法修改作为xhr.send()的实参

相关推荐
烟袅9 小时前
作用域链 × 闭包:三段代码,看懂 JavaScript 的套娃人生
前端·javascript
San30.9 小时前
深入理解 JavaScript 异步编程:从 Ajax 到 Promise
开发语言·javascript·ajax·promise
风止何安啊9 小时前
收到字节的短信:Trae SOLO上线了?尝尝鲜,浅浅做个音乐播放器
前端·html·trae
抱琴_9 小时前
大屏性能优化终极方案:请求合并+智能缓存双剑合璧
前端·javascript
用户463989754329 小时前
Harmony os——长时任务(Continuous Task,ArkTS)
前端
fruge9 小时前
低版本浏览器兼容方案:IE11 适配 ES6 语法与 CSS 新特性
前端·css·es6
颜酱10 小时前
开发工具链-构建、测试、代码质量校验常用包的比较
前端·javascript·node.js
mCell10 小时前
[NOTE] JavaScript 中的稀疏数组、空槽和访问
javascript·面试·v8
柒儿吖10 小时前
Electron for 鸿蒙PC - Native模块Mock与降级策略
javascript·electron·harmonyos
颜酱10 小时前
package.json 配置指南
前端·javascript·node.js