文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

jquery中axios和ajax有哪些区别

2024-04-02 19:55

关注

这篇文章主要介绍了jquery中axios和ajax有哪些区别的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇jquery中axios和ajax有哪些区别文章都会有所收获,下面我们一起来看看吧。

jquery中axios和ajax的区别:1、axios是通过promise实现对ajax技术的一种封装,而jquery将请求技术进行了封装变成了ajax;2、axios是一个基于Promise的HTTP库,而ajax是对原生XHR的封装。

本教程操作环境:windows10系统、jquery3.6.0版本、Dell G3电脑。

jquery中axios和ajax区别

axios和ajax的区别:

axios是一个基于Promise的HTTP库,而ajax是对原生XHR的封装;

ajax技术实现了局部数据的刷新,而axios实现了对ajax的封装。

axios是通过promise实现对ajax技术的一种封装,就像JQuery实现ajax封装一样。

简单来说就是:ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。也就是说,jQuery 将请求技术进行了封装 变成了 ajax , 而通过 promise 又把 ajax 进行封装就成了 axios。axios是ajax,ajax不止axios。

有了ajax,为什么还要使用axios?

在现在的前端 mvvm 模式下 axios 更适合于数据请求。

扩展知识:

ajax定义

简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示

jQuery为我们将原生ajax进行了封装,现在我们只需要一行简单的代码,就可以实现 AJAX 功能。

1.底层接口

    $.ajax({
      url:'',    //请求地址
      method:'',  //请求方式
      data:{},     //传参  无参可不写
      success:function(res){
        //请求成功的回调函数
      },
      error:function(err){
        //请求失败的回调函数
      },
    })

2.快捷方式

    $.get(url,data,function(res){})
    $.post(url,data,function(res){})

axios请求的使用

Axios 是一个基于 promise (Promise 是异步编程的一种解决方案)的 HTTP 库,可以用在浏览器和 node.js 中

jQuery ajax:

本身是针对MVC的编程,不符合现在前端MVVM

基于原生的XHR开发,XHR本身的架构不清晰,已经有了fetch的替代方案

JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理(采取个性化打包的方案又不能享受CDN服务)

axios的原生使用:

axios({
      url:'http://47.93.206.13:8002/user/login',
      // baseURL:'http://47.93.206.13:8002',
      method:'post',
      // params:    用于get请求
      data:{    //用于post请求
        username:'admin1',
        password:'123321'   
      }
    }).then((res) => {
      console.log(res);
    })

axios快捷方法:

/ 引入
let axios=require('axios')//到当前node_modules找,找不到再往上找
// 封装写法
axios.get('http://47.107.65.238:8888/index/article/pageQuery?page=1&pageSize=10')
  .then(function (response) {
    console.log(response);
  })

关于“jquery中axios和ajax有哪些区别”这篇文章的内容就介绍到这里,感谢各位的阅读!相信大家对“jquery中axios和ajax有哪些区别”知识都有一定的了解,大家如果还想学习更多知识,欢迎关注编程网行业资讯频道。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     807人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     351人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     314人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     433人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     221人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯