jquery中axios和ajax有哪些區別

這篇文章主要介紹了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有哪些區別”知識都有一定的了解，大家如果還想學習更多知識，歡迎關注億速云行業資訊頻道。