AJAX即“Asynchronous Javascript And XML”(異步JavaScript和XML),是指一種創建交互式網頁應用的網頁開發技術。
Ajax的核心是XMLHttpRequest對象
關鍵流程:
- 發送異步請求
- 接受響應
- 執行回調
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基礎一樣。但是還是有區別的。
- GET會把參數放在URL后面傳遞,POST則作為HTTP消息的實體內容。
- GET會限制傳輸的大?。ú淮笥?KB),而POST理論上是無限制的。
- GET數據會被緩存,有安全問題。而POST沒有。
- GET和POST在服務器的獲取方式不同。
$.getScipt()方法:
語法:$.getScipt( [url [,callback])
與load()方法相同,不過是用來加載和調用一個JS文件。
回調函數有兩個參數
- url / 鏈接地址
- callback / 回調函數
$.getJSON()方法:
語法:$.getJSON( [url [,data] [,callback])
與$.getScipt()方法相同,不過是用來加載一個JSON文件。
回調函數有兩個參數
- url / 鏈接地址
- data / 傳遞的數據
- callback / 回調函數
附加一張ajax的腦圖:
JQuery.Ajax.png