Web - ajax(非同步重新整理) & json(資料交換格式)
一、AJAX
1.ajax是什麼?
AJAX: “Asynchronous JavaScript And XML”(非同步JavaScript和XML)
非同步重新整理: 不重新整理頁面的情況下 , 向伺服器傳送請求.
2.ajax原理:
1.1 使用JavaScript獲得瀏覽器內建的AJAX引擎(XMLHttpRequest)物件.
1.2 通過AJAX引擎確定請求路徑和請求引數.
1.3 通知AJAX引擎傳送請求(在不重新整理瀏覽器位址列的情況下)
2.1 伺服器獲得請求引數後,進行處理請求引數.
2.2 伺服器響應資料給瀏覽器.
2.3 AJAX引擎獲得伺服器響應的資料 , 通過執行js的回撥函式將資料傳遞給瀏覽器頁面.
3.jquery封裝好的ajax方法.
$.get(url , param , function(){ } , type);
$.post(url , param , function(data ,statusText , xhr ){
url: 請求的地址.
param: 請求的引數.
function:回撥函式 .
data: 伺服器返回的資料.
statusText: 對於狀態碼的一個文字解析.
xhr:ajax物件.
type: 是否要求jquery對返回的資料進行格式處理.
} , type);
低階封裝方法(但更全面):
$.ajax({
url:地址,
data:引數
type:“請求方式”,
dataType:“jquery對於資料進行格式處理”,
success:function(data,statusText,xhr){
//成功的回撥函式
},
error:function(data,statusText,xhr){
//處理錯誤函式
}
});
二、JSON
1.json:資料交換格式 -> 其實就是一個字串.
json的物件格式:
var json1 = {
“屬性名”:屬性值 ,
…
}
標準規範: key必須使用雙引號 ,
json的陣列格式:
var json = [ele1 , ele2 , …] / / 多個之間用 , 隔開.
2.json-lib工具: 將java資料與json資料相互轉換的工具.
使用前提:
1.匯入jar包.
連結：https://pan.baidu.com/s/1Bx1uPIhm4IT60gDVbnNVZA 密碼：87km
常用物件:
- JSONObject : java物件(JavaBean , Map ) 與json資料轉換
- JSONArray: java集合(List , Array ) 與json資料轉換
常用方法:
- static fromObject (…): 靜態 , java物件/集合 -> jsonlib物件
- toString (): 將jsonlib物件轉換為json字串.
例:
JSONObject.fromObject(map).toString();
JSONArray.fromObject(list).toString();
01_ajax案例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>post方法的使用</title>
<!-- 匯入js類庫 -->
<script src="../js/jquery.js"></script>
<script>
// 點選事件.
function req() {
$.post("/test","username=juan",function (data) {
$("#msg").html(data)
})
}
</script>
</head>
<body>
<input type="button" value="點我傳送請求" onclick="req()">
<div id="msg"></div>
</body>
</html>
02_json案例:
public class Test02 {
@Test
public void test01(){
// java陣列 ---> json格式.
String[] str ={"你好","小明","小李"};
String s = JSONArray.fromObject(str).toString();
System.out.println(s);
}
@Test
public void test02(){
// List集合 ---> json格式.
List<Object> list = new ArrayList<>();
list.add("aaa");
list.add("aaa");
list.add("aaa");
String s = JSONArray.fromObject(list).toString();
System.out.println(s);
}
@Test
public void test04(){
// map集合 ---> json格式.
Map<String , Object> map = new HashMap<>();
map.put("aaa","老虎");
map.put("bbb","老虎");
map.put("ccc","老虎");
String s = JSONObject.fromObject(map).toString();
System.out.println(s);
}
@Test
public void test06(){
// List<JavaBean> ---> json格式.
List<User> list = new ArrayList<>();
String s = JSONArray.fromObject(list).toString();
System.out.println(s);
}
}