溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

jquery中axios和ajax有哪些區(qū)別

發(fā)布時間:2022-06-15 09:55:11 來源:億速云 閱讀:215 作者:zzz 欄目:web開發(fā)

這篇文章主要介紹了jquery中axios和ajax有哪些區(qū)別的相關知識,內(nèi)容詳細易懂,操作簡單快捷,具有一定借鑒價值,相信大家閱讀完這篇jquery中axios和ajax有哪些區(qū)別文章都會有所收獲,下面我們一起來看看吧。

jquery中axios和ajax的區(qū)別:1、axios是通過promise實現(xiàn)對ajax技術的一種封裝,而jquery將請求技術進行了封裝變成了ajax;2、axios是一個基于Promise的HTTP庫,而ajax是對原生XHR的封裝。

本教程操作環(huán)境:windows10系統(tǒng)、jquery3.6.0版本、Dell G3電腦。

jquery中axios和ajax區(qū)別

axios和ajax的區(qū)別:

axios是一個基于Promise的HTTP庫,而ajax是對原生XHR的封裝;

ajax技術實現(xiàn)了局部數(shù)據(jù)的刷新,而axios實現(xiàn)了對ajax的封裝。

axios是通過promise實現(xiàn)對ajax技術的一種封裝,就像JQuery實現(xiàn)ajax封裝一樣。

簡單來說就是:ajax技術實現(xiàn)了網(wǎng)頁的局部數(shù)據(jù)刷新,axios實現(xiàn)了對ajax的封裝。也就是說,jQuery 將請求技術進行了封裝 變成了 ajax , 而通過 promise 又把 ajax 進行封裝就成了 axios。axios是ajax,ajax不止axios。

有了ajax,為什么還要使用axios?

在現(xiàn)在的前端 mvvm 模式下 axios 更適合于數(shù)據(jù)請求。

擴展知識:

ajax定義

簡短地說,在不重載整個網(wǎng)頁的情況下,AJAX 通過后臺加載數(shù)據(jù),并在網(wǎng)頁上進行顯示

jQuery為我們將原生ajax進行了封裝,現(xiàn)在我們只需要一行簡單的代碼,就可以實現(xiàn) AJAX 功能。

1.底層接口

    $.ajax({
      url:'',    //請求地址
      method:'',  //請求方式
      data:{},     //傳參  無參可不寫
      success:function(res){
        //請求成功的回調(diào)函數(shù)
      },
      error:function(err){
        //請求失敗的回調(diào)函數(shù)
      },
    })

2.快捷方式

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

axios請求的使用

Axios 是一個基于 promise (Promise 是異步編程的一種解決方案)的 HTTP 庫,可以用在瀏覽器和 node.js 中

jQuery ajax:

本身是針對MVC的編程,不符合現(xiàn)在前端MVVM

基于原生的XHR開發(fā),XHR本身的架構(gòu)不清晰,已經(jīng)有了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有哪些區(qū)別”這篇文章的內(nèi)容就介紹到這里,感謝各位的閱讀!相信大家對“jquery中axios和ajax有哪些區(qū)別”知識都有一定的了解,大家如果還想學習更多知識,歡迎關注億速云行業(yè)資訊頻道。

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI