JQuery:Ajax

AJAX即“Asynchronous Javascript And XML”(異步JavaScript和XML),是指一種創建交互式網頁應用的網頁開發技術。

Ajax的核心是XMLHttpRequest對象

關鍵流程:

  1. 發送異步請求
  2. 接受響應
  3. 執行回調

JQ對Ajax進行了封裝:

  • 第一層:$.ajax()
  • 第二層:$.get() , $.post() , load()
  • 第三層:$.getScript() , $getJSON()

$.ajax()方法:

語法:$.ajax({name:value, name:value, ... })
  • async / 布爾值,表示請求是否異步處理。默認是 true。
  • beforeSend(xhr) / 發送請求前運行的函數。
  • cache / 布爾值,表示瀏覽器是否緩存被請求頁面。默認是 true。
  • complete(xhr,status) / 請求完成時運行的函數(在請求成功或失敗之后均調用,即在 success 和 error 函數之后)。
  • contentType / 發送數據到服務器時所使用的內容類型。默認是:"application/x-www-form-urlencoded"。
  • context / 為所有 AJAX 相關的回調函數規定 "this" 值。
  • data / 規定要發送到服務器的數據。
  • dataFilter(data,type) / 用于處理 XMLHttpRequest 原始響應數據的函數。
  • dataType / 預期的服務器響應的數據類型。
  • error(xhr,status,error) / 如果請求失敗要運行的函數。
  • global / 布爾值,規定是否為請求觸發全局 AJAX 事件處理程序。默認是 true。
  • ifModified / 布爾值,規定是否僅在最后一次請求以來響應發生改變時才請求成功。默認是 false。
  • jsonp / 在一個 jsonp 中重寫回調函數的字符串。
  • jsonpCallback / 在一個 jsonp 中規定回調函數的名稱。
  • password / 規定在 HTTP 訪問認證請求中使用的密碼。
  • processData / 布爾值,規定通過請求發送的數據是否轉換為查詢字符串。默認是 true。
  • scriptCharset / 規定請求的字符集。
  • success(result,status,xhr) / 當請求成功時運行的函數。
  • timeout / 設置本地的請求超時時間(以毫秒計)。
  • traditional / 布爾值,規定是否使用參數序列化的傳統樣式。
  • type / 規定請求的類型(GET 或 POST)。
  • url / 規定發送請求的 URL。默認是當前頁面。
  • username / 規定在 HTTP 訪問認證請求中使用的用戶名。
  • xhr / 用于創建 XMLHttpRequest 對象的函數。

load()方法:

語法:load( [url [,data] [,callback] )

url:請求頁面的URL地址
data:發送服務器的數據
callback:請求完成是的回調函數,無論請求是否成功或者失敗

回調函數有三個參數

  • data / 返回的內容
  • textStatus / 請求的狀態
  • XMLHttpRequest / XHR對象

load()方法,無論Ajax請求是否成功,只要請求完全(complete)后,回調函數(callback)就被觸發。

load()方法與load()事件是有區別的,雖然名字一樣,但是調用的時候是根據參數的進行判別的。


$.get()方法:

語法:$.get( [url [,data] [,callback] [,type] )

數據返回成功,就可以調用回調函數。

回調函數有兩個參數

  • data / 返回的內容
  • textStatus / 請求的狀態

$.post()方法:

語法:$.post( [url [,data] [,callback] [,type] )

數據返回成功,就可以調用回調函數。

回調函數有兩個參數

  • data / 返回的內容
  • textStatus / 請求的狀態

$.post方式更$.get基礎一樣。但是還是有區別的。

  1. GET會把參數放在URL后面傳遞,POST則作為HTTP消息的實體內容。
  2. GET會限制傳輸的大?。ú淮笥?KB),而POST理論上是無限制的。
  3. GET數據會被緩存,有安全問題。而POST沒有。
  4. GET和POST在服務器的獲取方式不同。

$.getScipt()方法:

語法:$.getScipt( [url  [,callback])

與load()方法相同,不過是用來加載和調用一個JS文件。

回調函數有兩個參數

  • url / 鏈接地址
  • callback / 回調函數

$.getJSON()方法:

語法:$.getJSON( [url [,data] [,callback])

與$.getScipt()方法相同,不過是用來加載一個JSON文件。

回調函數有兩個參數

  • url / 鏈接地址
  • data / 傳遞的數據
  • callback / 回調函數

附加一張ajax的腦圖:

JQuery.Ajax.png
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容