Jquery ajax 詳解(Day_16)
太在意別人的看法最後會有兩種結局,要麼自己累死,要麼讓別人整死。
-
簡介
AJAX 是與伺服器交換資料的技術,它在不過載全部頁面的情況下,實現了對部分網頁的更新。
簡短地說,在不過載整個網頁的情況下,AJAX 通過後臺載入資料,並在網頁上進行顯示。
1、AJAX load 方法
load() 方法通過 AJAX 請求從伺服器載入資料,並把返回的資料放置到指定的元素中。
註釋:還存在一個名為 load的 jQuery 事件方法。呼叫哪個,取決於引數。
語法:
load(url,data,function(response,status,xhr))
引數 |
描述 |
url | 規定要將請求傳送到哪個 URL。 |
data | 可選。規定連同請求傳送到伺服器的資料。 |
function(responseTxt,statusTxt,xhr) |
可選。規定當請求完成時執行的函式。 額外的引數:
|
下面的例子會在 load() 方法完成後顯示一個提示框。如果 load() 方法已成功,則顯示"外部內容載入成功!",而如果失敗,則顯示錯誤訊息:
1 $("button").click(function(){
2 $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
3 if(statusTxt=="success")
4 alert("外部內容載入成功!");
5 if(statusTxt=="error")
6 alert("Error: "+xhr.status+": "+xhr.statusText);
7 });
8 });
2、$.AJAX
1 語法:$.ajax({鍵值對});2 //使用$.ajax()傳送非同步請求 3 $.ajax({ 4 url:"ajaxServlet1111" , // 請求路徑 5 type:"POST" , //請求方式 6 //data: "username=jack&age=23",//請求引數 7 data:{"username":"jack","age":23}, 8 success:function (data) { 9 alert(data); 10 },//響應成功後的回撥函式 11 error:function () { 12 alert("出錯啦...") 13 },//表示如果請求響應出現錯誤,會執行的回撥函式 14 15 dataType:"text"//設定接受到的響應資料的格式 16 });
2、$.get() 方法
$.get() 方法通過 HTTP GET 請求從伺服器上請求資料。
語法:
$.get(URL,[data],[callback],[type]);
使用 $.get() 方法從伺服器上的一個檔案中取回資料:
$("button").click(function(){
$.get("demo_test.php",function(data,status){
alert("資料: " + data + "\n狀態: " + status);
});
});
2、$.post() 方法
$.post() 方法通過 HTTP POST 請求向伺服器提交資料。
語法:
$.post(URL,[data],[callback],[type]);
使用 $.post() 連同請求一起傳送資料:
1 $("button").click(function(){
2 $.post("/try/ajax/demo_test_post.php",
3 {
4 url:"AjaxServlet"
5 },
6 function(data,status){
7 alert("資料: \n" + data + "\n狀態: " + status);
8 });
9 });
引數: | 描述: |
url | 請求路徑 |
data | 請求引數 |
callback | 回撥函式 |
type | 響應結果型別 |
-
GET 和 POST 方法的區別:
1、傳送的資料數量
在 GET 中,只能傳送有限數量的資料,因為資料是在 URL 中傳送的。
在 POST 中,可以傳送大量的資料,因為資料是在正文主體中傳送的。
2、安全性
GET 方法傳送的資料不受保護,因為資料在 URL 欄中公開,這增加了漏洞和黑客攻擊的風險。
POST 方法傳送的資料是安全的,因為資料未在 URL 欄中公開,還可以在其中使用多種編碼技術,這使其具有彈性。
3、加入書籤中
GET 查詢的結果可以加入書籤中,因為它以 URL 的形式存在;而 POST 查詢的結果無法加入書籤中。
4、編碼
在表單中使用 GET 方法時,資料型別中只接受 ASCII 字元。
在表單提交時,POST 方法不繫結表單資料型別,並允許二進位制和 ASCII 字元。
5、可變大小
GET 方法中的可變大小約為 2000 個字元。
POST 方法最多允許 8 Mb 的可變大小。
6、快取
GET 方法的資料是可快取的,而 POST 方法的資料是無法快取的。
7、主要作用
GET 方法主要用於獲取資訊。而 POST 方法主要用於更新資料。
PS: