jQuery中ajax

最新推荐文章于 2021-08-05 12:46:10 发布

Amanda_wmy

最新推荐文章于 2021-08-05 12:46:10 发布

阅读量242

点赞数

分类专栏： jQuery ajax

本文链接：https://blog.csdn.net/Amanda_wmy/article/details/81280410

版权

jQuery 同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

ajax

2 篇文章 0 订阅

订阅专栏

jQuery中ajax

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>ajax-jquery</title>
</head>
<body>
  <!-- 首先引入jquery.js -->
  <script src="jquery.js"></script>
  <script>
     //底层函数
     $.ajax({
        url:'time.php',
        type:"get",
        //用于提交到服务器的参数
        //get通过url传递
        //post通过请求体传递
        data:{id:1,name:'zs'}, //设置的参数
        dataType:'json', //用于设置服务端响应体的类型
        beforeSend:function(xhr){
           console.log('beforeSend'.xhr) //在所有请求发送之前，readystate=0
        },
        //只有请求成功，（状态码为200），才会执行这个函数
        success:function(res){
          //res会自动根据服务器端响应的content-type(也就是后端返回的不一定都是json格式的)自动转换为对象
           //这是jquery提供的功能，内部实现的
           //一旦设置的datatype选项，就不在关心服务端响应的content-type
           //客户端会主观的认为服务端返回的数据是json格式
            console.log(res)
        },
        error:function(xhr){
          //只有请求不正常（状态码不为200），才会执行这个函数
           console.log('error',xhr)
        },
        //请求完成
        complete:function(xhr){
          //不管成功还是失败都是完成，都会执行这个函数
           console.log('complete',xhr)
        }
    })


    //高度封装的函数
    //url地址，传递的参数，回调函数（请求成功时调用）
    $.get('json.php', {id:1}, function(res){
      console.log(res)
    })

     $.post('json.php', {id:1}, function(res){
      console.log(res)
    })
    //获得 JSON 数据
     $.getJSON('json.php', {id:1}, function(res){
      console.log(res)
    })
  </script>
</body>
</html>

Amanda_wmy

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery中ajax

jQuery中ajax&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&a
复制链接

扫一扫

专栏目录