• 猿创征文 | 使用Jquery封装的AJAX请求数据


    目录

    一、$.ajax() 方法

    二、$.ajaxSetup() 方法

    三、快捷方法

    1、$.get() 方法

    2、$.post() 方法

    3、$.getJSON() 方法

    4、封装一个$.postJSON() 方法


    一、$.ajax() 方法

    该方法用于执行一个异步的ajax的请求。

    基本语法格式如下:

    ( 这里只列举了一些常用的参数,里面还有很多的参数,大家感兴趣的可以到官网上查看。)

    1. $.ajax({
    2. //请求路径
    3. url: "",
    4. //请求方式 比如get、post等
    5. method: "",
    6. //请求头
    7. headers: {},
    8. //携带参数属性 比如json格式
    9. data: {},
    10. //请求成功回调
    11. success(res){},
    12. //请求失败回调
    13. error(err){}
    14. ......
    15. })

    url :String类型,发送请求的url地址

    method:String类型,请求方式,比如post、get、put、delete等

    headers:PlainObject类型,请求头,使用{键:值}对表示,例如:{ 'Content-Type': 'application/json' }

    PlainObject:纯粹的对象(即通过 "{}" 或者 "new Object" 创建的)

    data: Object类型或者String类型,发送给服务器的数据(即携带的相关参数)

    success:请求成功后的回调函数,它有三个参数:

    1. 从服务器返回的数据(Object类型)
    2. 一个用于描述状态的字符串
    3. jqXHR对象

    error:请求失败时的回调函数,它也有三个参数:

    1. jqXHR对象
    2. 描述发生错误类型的一个字符串
    3. 捕获的异常对象

    二、$.ajaxSetup() 方法

    该方法用于配置ajax全局请求,为以后要用到的ajax请求设置默认的值。

    该方法的参数和$.ajax()方法的参数是一致的。

    比如,我们可以让所有的ajax请求的请求头headers都携带token值:

    1. $.ajaxSetup({
    2. headers:{
    3. 'Authorization':token
    4. }
    5. })

    三、快捷方法

    1、$.get() 方法

    该方法使用一个HTTP GET请求从服务器加载数据。

    该方法有四个参数:

    1. 请求路径
    2. 携带的参数
    3. 成功回调函数
    4. 从服务器返回的预期的数据类型

    例子:发送get无参请求:

    发送get有参请求: 

    2、$.post() 方法

    该方法使用一个HTTP POST 请求从服务器加载数据。

    该方法有四个参数:

    1. 请求路径
    2. 携带的参数
    3. 成功回调函数
    4. 从服务器返回的预期的数据类型

    使用post发送有参请求:

    3、$.getJSON() 方法

    该方法使用一个HTTP GET请求从服务器加载JSON编码的数据。

    该方法有三个参数:

    1. 请求路径
    2. 携带的参数
    3. 成功回调函数

    当我们需要使用get方法发送JSON格式的数据给服务器时,可以使用该方法。

    4、封装一个$.postJSON() 方法

    jQuery没有提供$.postJSON() 方法,所以我们自己封装一个来使用:
     

    1. jQuery['postJSON'] = function(url, data, callback){
    2. return $.ajax({
    3. url,
    4. method: 'post',
    5. data: JSON.stringify(data),
    6. headers: {
    7. "Content-Type": "application/json"
    8. },
    9. success: callback
    10. })
    11. }
    12. //使用
    13. var url = 'url请求地址'
    14. var obj = {
    15. //要携带的参数
    16. }
    17. $.postJSON(url, obj, function(res){
    18. console.log(res);
    19. });

    ❤最后,使用这些方法的时候记得引入jQuery。❤

  • 相关阅读:
    Linux字符设备驱动开发(一)
    JDBC 数据库操作
    前端面试题目(二十九)
    android 系统驱动调试
    七个很实用的开源项目「GitHub 热点速览」
    C++入门(二)
    JavaScript 中 toString 的奇妙使用
    java中使用springboot2.5.6整合activiti6和flowable6.3.0工作流引擎
    5G注册流程详解
    戴尔笔记本重装系统硬盘加密怎么解除
  • 原文地址:https://blog.csdn.net/lq313131/article/details/126572260