AJAX 相关知识

最新推荐文章于 2024-08-06 16:00:52 发布

Gnaf12345

最新推荐文章于 2024-08-06 16:00:52 发布

阅读量72

点赞数

文章标签： ajax javascript ecmascript

本文链接：https://blog.csdn.net/Gnaf12345/article/details/125264188

版权

一、 ajax 的作用

刷新局部数据（在不刷新页面的情况下提交获取数据）

二、同步和异步的区别

同步：上一个任务结束，下一个任务才能开始比如alert 弹窗事件

异步：多个任务按顺序开始，但不一定按顺序结束比如下载文件；

三、步骤

创建： var ajax =new XMLHttpRequest()
配置： var xhr.open(请求方式，请求地址，是否异步）
响应：ajax.onreadystatechange = function(){console.log(ajax.responseText)}
发送：ajax.send(null)；

四、一般的固定写法

<script src="js/jquery-3.6.0.min.js"></script>
<script>
    $.ajax({
        type:'get',
        url:'https://m.maizuo.com/gateway?cityId=110100&pageNum=1&pageSize=10&type=1&k=165660',
        headers:{
            'X-Client-Info': '{"a":"3000","ch":"1002","v":"5.2.0","e":"1654601454997669363253249","bc":"110100"}',
            'X-Host':' mall.film-ticket.film.list'
        },
        success:function(res){
            // console.log(res.data.films)
            res.data.films.forEach(function (item){
                var str=`<p>${item.name}</p>`;
                // document.body.innerHTML+=str;
                // console.log(item.poster);
            })
            
        }
    })