JSON是一種簡單的數(shù)據(jù)格式,比xml更輕巧。其規(guī)則很簡單,對象是一個無序的名稱/值對集合,下面有個案例,大家可以感受下
1:
JSON(JavaScriptObject Notation)一種簡單的數(shù)據(jù)格式,比xml更輕巧。JSON是JavaScript原生格式,這意味著在JavaScript中處理JSON數(shù)據(jù)不需要任何特殊的API或工具包。
JSON的規(guī)則很簡單:對象是一個無序的“‘名稱/值'對”集合。一個對象以“{”(左括號)開始,“}”(右括號)結(jié)束。每個“名稱”后跟一個“:”(冒號);“‘名稱/值'對”之間使用“,”(逗號)分隔。
JSON用冒號(而不是等號)來賦值。每一條賦值語句用逗號分開。整個對象用大括號封裝起來??捎么罄ㄌ柗旨壡短讛?shù)據(jù)。
對象描述中存儲的數(shù)據(jù)可以是字符串,數(shù)字或者布爾值。對象描述也可存儲函數(shù),那就是對象的方法。
<span style="font-size:18px;">{"person": {
"name":"Andy Budd",
"website":"http://andybudd.com/",
"email":"andy@clearleft.com"
}
}</span>
JSON 只是一種文本字符串。它被存儲在responseText 屬性中
為了讀取存儲在 responseText 屬性中的JSON 數(shù)據(jù),需要根據(jù)JavaScript 的eval語句。函數(shù) eval會把一個字符串當(dāng)作它的參數(shù)。然后這個字符串會被當(dāng)作 JavaScript 代碼來執(zhí)行。因為 JSON 的字符串就是由 JavaScript 代碼構(gòu)成的,所以它本身是可執(zhí)行的
2:案例
<%@ page language=
"java"
pageEncoding=
"UTF-8"
%>
<%@ page language=
"java"
pageEncoding=
"UTF-8"
%>
02
<html xmlns=
"en"
lang=
"en"
>
03
<head>
04
<meta http-equiv=
"content-type"
content=
"text/html; charset=utf-8"
/>
05
<title>People at Clearleft</title>
06
<style type=
"text/css"
>
07
@importurl(
"clearleft.css"
);
08
</style>
09
<script type=
"text/javascript"
>
10
window.onload=function(){
11
var aNodes=document.getElementsByTagName(
"a"
);
12
13
for
(var i =
0
;i < aNodes.length; i++){
14
15
aNodes[i].onclick=function(){
16
var request=
new
XMLHttpRequest();
17
var url=
this
.href;
18
var method=
"GET"
;
19
request.open(method,url);
20
request.send(
null
);
21
request.onreadystatechange=function(){
22
if
(request.readyState==
4
){
23
if
(request.status==
200
||request==
304
){
24
var result=request.responseText;
//json被存儲在responseText屬性中
25
var object=eval(
"("
+result+
")"
);
//讀取responseText中的json數(shù)據(jù)
26
var name= object.person.name;
//讀取json對象中存儲的數(shù)據(jù)
27
var website= object.person.website;
28
var email= object.person.email;
29
var aNode=document.createElement(
"a"
);
30
aNode.appendChild(document.createTextNode(name+
":"
+
"email"
+
":"
+website));
31
aNode.href=
"mailTo"
+
"email"
+
",website"
;
32
var h2Node=document.createElement(
"h2"
);
33
h2Node.appendChild(aNode);
34
var dtails=document.getElementById(
"details"
);
35
details.innerHTML=
""
;
//防止重復(fù)的添加字符串
36
dtails.appendChild(h2Node);
37
}
38
}
39
}
40
return
false
;
41
}
42
}
43
};
44
</script>
45
</head>
46
<body>
47
<h1>
48
People
49
</h1>
50
<ul>
51
<li>
52
<a href=
"files/andy.js"
>Andy</a>
53
</li>
54
<li>
55
<a href=
"files/richard.js"
>Richard</a>
56
</li>
57
<li>
58
<a href=
"files/jeremy.js"
>Jeremy</a>
59
</li>
60
</ul>
61
<div id=
"details"
></div>
62
</body>
63
</html>