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()的实参

相关推荐
vipbic7 小时前
关于Vue打包的遇到模板引擎解析的引号问题
前端·webpack
qq_510351597 小时前
vw 和 clamp()
前端·css·html
良木林7 小时前
JS中正则表达式的运用
前端·javascript·正则表达式
芭拉拉小魔仙7 小时前
【Vue3+TypeScript】H5项目实现企业微信OAuth2.0授权登录完整指南
javascript·typescript·企业微信
JosieBook8 小时前
【SpringBoot】21-Spring Boot中Web页面抽取公共页面的完整实践
前端·spring boot·python
吃饭睡觉打豆豆嘛8 小时前
深入剖析 Promise 实现:从原理到手写完整实现
前端·javascript
前端端9 小时前
claude code 原理分析
前端
GalaxyMeteor9 小时前
Elpis 开发框架搭建第二期 - Webpack5 实现工程化建设
前端
Spider_Man9 小时前
从 “不会迭代” 到 “面试加分”:JS 迭代器现场教学
前端·javascript·面试
我的写法有点潮9 小时前
最全Scss语法,赶紧收藏起来吧
前端·css