ajax之深入解析（2）
我們前面實(shí)現(xiàn)了用原生的JavaScript代碼實(shí)現(xiàn)ajax的異步數(shù)據(jù)傳輸。接下來(lái)，我們?cè)偈褂靡粋€(gè)流行的js框架jQuery來(lái)實(shí)現(xiàn)ajax。
通過(guò) jQuery AJAX 方法，我們能夠使用 HTTP Get 和 HTTP Post 從遠(yuǎn)程服務(wù)器上請(qǐng)求文本、HTML、XML 或 JSON，同時(shí)，我們能夠把這些外部數(shù)據(jù)直接載入網(wǎng)頁(yè)里的被選元素中。在使用jQuery時(shí)，我們需要在網(wǎng)頁(yè)中引入jQuery的腳本文件。jQuery有兩個(gè)顯著特點(diǎn)，即隱式迭代和鏈?zhǔn)骄幊?#xff0c;jQuery可以用$符號(hào)表示，出現(xiàn)jQuery的地方可以使用$符號(hào)代替。
下面的表格列出了所有的 jQuery AJAX 方法：
| $.ajax() | 執(zhí)行異步 AJAX 請(qǐng)求 |
| $.ajaxPrefilter() | 在每個(gè)請(qǐng)求發(fā)送之前且被 $.ajax() 處理之前，處理自定義 Ajax 選項(xiàng)或修改已存在選項(xiàng) |
| $.ajaxSetup() | 為將來(lái)的 AJAX 請(qǐng)求設(shè)置默認(rèn)值 |
| $.ajaxTransport() | 創(chuàng)建處理 Ajax 數(shù)據(jù)實(shí)際傳送的對(duì)象 |
| $.get() | 使用 AJAX 的 HTTP GET 請(qǐng)求從服務(wù)器加載數(shù)據(jù) |
| $.getJSON() | 使用 HTTP GET 請(qǐng)求從服務(wù)器加載 JSON 編碼的數(shù)據(jù) |
| $.getScript() | 使用 AJAX 的 HTTP GET 請(qǐng)求從服務(wù)器加載并執(zhí)行 JavaScript |
| $.param() | 創(chuàng)建數(shù)組或?qū)ο蟮男蛄谢硎拘问?#xff08;可用于 AJAX 請(qǐng)求的 URL 查詢字符串） |
| $.post() | 使用 AJAX 的 HTTP POST 請(qǐng)求從服務(wù)器加載數(shù)據(jù) |
| ajaxComplete() | 規(guī)定 AJAX 請(qǐng)求完成時(shí)運(yùn)行的函數(shù) |
| ajaxError() | 規(guī)定 AJAX 請(qǐng)求失敗時(shí)運(yùn)行的函數(shù) |
| ajaxSend() | 規(guī)定 AJAX 請(qǐng)求發(fā)送之前運(yùn)行的函數(shù) |
| ajaxStart() | 規(guī)定第一個(gè) AJAX 請(qǐng)求開始時(shí)運(yùn)行的函數(shù) |
| ajaxStop() | 規(guī)定所有的 AJAX 請(qǐng)求完成時(shí)運(yùn)行的函數(shù) |
| ajaxSuccess() | 規(guī)定 AJAX 請(qǐng)求成功完成時(shí)運(yùn)行的函數(shù) |
| load() | 從服務(wù)器加載數(shù)據(jù)，并把返回的數(shù)據(jù)放置到指定的元素中 |
| serialize() | 編碼表單元素集為字符串以便提交 |
| serializeArray() | 編碼表單元素集為 names 和 values 的數(shù)組 |
我們選擇上述列表中的若干方法予以介紹。
jQuery load() 方法是簡(jiǎn)單但強(qiáng)大的 AJAX 方法。load() 方法從服務(wù)器加載數(shù)據(jù)，并把返回的數(shù)據(jù)放入被選元素中。
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <script src="js/jquery-1.11.1.js"></script> 7 </head> 8 <script> 9 $(document).ready(function(){ 10 $("button").click(function(){ 11 $("#content").load("resource/book.xml"); 12 }) 13 }) 14 </script> 15 <body> 16 <div id="content"><h3>演示ajx</h3></div> 17 <button>點(diǎn)擊</button> 18 </body> 19 </html>可選的 callback 參數(shù)規(guī)定當(dāng) load() 方法完成后所要允許的回調(diào)函數(shù)。回調(diào)函數(shù)可以設(shè)置不同的參數(shù)：
- responseTxt?- 包含調(diào)用成功時(shí)的結(jié)果內(nèi)容
- statusTXT?- 包含調(diào)用的狀態(tài)
- xhr?- 包含 XMLHttpRequest 對(duì)象
jQuery get() 和 post() 方法用于通過(guò) HTTP GET 或 POST 請(qǐng)求從服務(wù)器請(qǐng)求數(shù)據(jù)。
兩種在客戶端和服務(wù)器端進(jìn)行請(qǐng)求-響應(yīng)的常用方法是：GET 和 POST。
- GET?- 從指定的資源請(qǐng)求數(shù)據(jù)
- POST?- 向指定的資源提交要處理的數(shù)據(jù)
GET 基本上用于從服務(wù)器獲得（取回）數(shù)據(jù)。注釋：GET 方法可能返回緩存數(shù)據(jù)。
POST 也可用于從服務(wù)器獲取數(shù)據(jù)。不過(guò)，POST 方法不會(huì)緩存數(shù)據(jù)，并且常用于連同請(qǐng)求一起發(fā)送數(shù)據(jù)。
$.get() 方法通過(guò) HTTP GET 請(qǐng)求從服務(wù)器上請(qǐng)求數(shù)據(jù)。
$.get(URL,callback);必需的?URL?參數(shù)規(guī)定您希望請(qǐng)求的 URL。
可選的?callback?參數(shù)是請(qǐng)求成功后所執(zhí)行的函數(shù)名。
$("button").click(function(){$.get("demo_test.jsp",function(data,status){alert("數(shù)據(jù): " + data + "\n狀態(tài): " + status);}); });$.post() 方法通過(guò) HTTP POST 請(qǐng)求從服務(wù)器上請(qǐng)求數(shù)據(jù)。
$("button").click(function(){$.post("/try/ajax/demo_test_post.jsp",{name:"lzy",pwd:"haha"},function(data,status){alert("數(shù)據(jù): \n" + data + "\n狀態(tài): " + status);}); });ajax() 方法用于執(zhí)行 AJAX（異步 HTTP）請(qǐng)求。所有的 jQuery AJAX 方法都使用 ajax() 方法。該方法通常用于其他方法不能完成的請(qǐng)求。
$.ajax({name:value, name:value, ... })該參數(shù)規(guī)定 AJAX 請(qǐng)求的一個(gè)或多個(gè)名稱/值對(duì)。下面的表格中列出了可能的名稱/值：
| async | 布爾值，表示請(qǐng)求是否異步處理。默認(rèn)是 true。 |
| beforeSend(xhr) | 發(fā)送請(qǐng)求前運(yùn)行的函數(shù)。 |
| cache | 布爾值，表示瀏覽器是否緩存被請(qǐng)求頁(yè)面。默認(rèn)是 true。 |
| complete(xhr,status) | 請(qǐng)求完成時(shí)運(yùn)行的函數(shù)（在請(qǐng)求成功或失敗之后均調(diào)用，即在 success 和 error 函數(shù)之后）。 |
| contentType | 發(fā)送數(shù)據(jù)到服務(wù)器時(shí)所使用的內(nèi)容類型。默認(rèn)是："application/x-www-form-urlencoded"。 |
| context | 為所有 AJAX 相關(guān)的回調(diào)函數(shù)規(guī)定 "this" 值。 |
| data | 規(guī)定要發(fā)送到服務(wù)器的數(shù)據(jù)。 |
| dataFilter(data,type) | 用于處理 XMLHttpRequest 原始響應(yīng)數(shù)據(jù)的函數(shù)。 |
| dataType | 預(yù)期的服務(wù)器響應(yīng)的數(shù)據(jù)類型。 |
| error(xhr,status,error) | 如果請(qǐng)求失敗要運(yùn)行的函數(shù)。 |
| global | 布爾值，規(guī)定是否為請(qǐng)求觸發(fā)全局 AJAX 事件處理程序。默認(rèn)是 true。 |
| ifModified | 布爾值，規(guī)定是否僅在最后一次請(qǐng)求以來(lái)響應(yīng)發(fā)生改變時(shí)才請(qǐng)求成功。默認(rèn)是 false。 |
| jsonp | 在一個(gè) jsonp 中重寫回調(diào)函數(shù)的字符串。 |
| jsonpCallback | 在一個(gè) jsonp 中規(guī)定回調(diào)函數(shù)的名稱。 |
| password | 規(guī)定在 HTTP 訪問認(rèn)證請(qǐng)求中使用的密碼。 |
| processData | 布爾值，規(guī)定通過(guò)請(qǐng)求發(fā)送的數(shù)據(jù)是否轉(zhuǎn)換為查詢字符串。默認(rèn)是 true。 |
| scriptCharset | 規(guī)定請(qǐng)求的字符集。 |
| success(result,status,xhr) | 當(dāng)請(qǐng)求成功時(shí)運(yùn)行的函數(shù)。 |
| timeout | 設(shè)置本地的請(qǐng)求超時(shí)時(shí)間（以毫秒計(jì)）。 |
| traditional | 布爾值，規(guī)定是否使用參數(shù)序列化的傳統(tǒng)樣式。 |
| type | 規(guī)定請(qǐng)求的類型（GET 或 POST）。 |
| url | 規(guī)定發(fā)送請(qǐng)求的 URL。默認(rèn)是當(dāng)前頁(yè)面。 |
| username | 規(guī)定在 HTTP 訪問認(rèn)證請(qǐng)求中使用的用戶名。 |
| xhr | 用于創(chuàng)建 XMLHttpRequest 對(duì)象的函數(shù)。 |
轉(zhuǎn)載于:https://www.cnblogs.com/lizhangyong/p/8385426.html
總結(jié)
以上是生活随笔為你收集整理的ajax之深入解析（2）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 使用nfs映射远程服务器磁盘目录
- 下一篇： Catalan数总结