ajax异步请求及案例

ajax异步请求及案例

1、ajax的介绍

• 前端页面想和后端页面进行数据交互就可以使用ajax。
• 让 javascript 发送异步的 http 请求，与后台服务器通信进行数据的获取，实现局部刷新。
• 在html页面使用ajax需要在web服务器环境下运行, 一般向自己的web服务器发送ajax请求。

2、ajax的使用

jquery将它封装成了一个方法$.ajax()，我们可以直接用这个方法来执行ajax请求。

• 使用前, 先在 https://www.apishop.net/ 注册账号, 在控制台获得APIKEY
• 使用时, 需更换自己的APIKEY进行测试使用

标准写法：

<script>
    $(function() {
   
        $.ajax({
   
            // url: 请求地址
            url: '申请的api接口地址',
            // type: 请求方式，默认是"GET"，常用的还有"POST"
            type: "GET",
            // dataType: 设置服务器返回的数据格式，常用的是 json 格式
            dataType: "JSON",
            // data: 设置发送给服务器的数据，没有参数不需设置

            // success: 设置请求成功后的回调函数
            success: function(response) {
   
                console.log(response);
                alert("请求成功!")
            },
            // error: 设置请求失败后的回调函数
            error: function() {
   
                alert("请求失败！请稍后再试！");
            },
            // async：设置请求是否异步，默认是true，表示异步，一般不用写
            async: true
        })
});
</script>

参数说明：