1.json是javascript對象表示法,json是存儲和交換文本信息的語法,類似於XML
json比XML更小,更易解析,更快
json能夠使用javascript內建的eval()函數來構建原生javascrpt對象。
下面這個例子表示創建json對象,並獲取它的值
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>在javascript中創建json對象</title>
<script type="text/javascript">
//創建json對象,json有兩種格式{}表示json對象,[]表示json數組
var jsonData={
"name":"jt",
"age":"18",
"address":"shenzheng",
"phone":"123456"
};
document.getElementById("jname").innerHTML=jsonData.name;
document.getElementById("jname").innerHTML=jsonData.age;
document.getElementById("jname").innerHTML=jsonData.address;
document.getElementById("jname").innerHTML=jsonData.phone;
</script>
</head>
<body>
<h2>在javascript中創建json對象</h2>
<p>
name:<span id="jname"></span><br/>
age:<span id="jage"></span><br/>
address:<span id="jaddress"></span><br/>
phone:<span id="jphone"></span<br/>
</p>
</body>
</html>
json的特性:
json是純文本,json具有自我描述性(人類可讀),json具有層級結構值中存在值,json可以通過javascript進行解析(使用內建的 JavaScript eval() 方法進行解析),json可以使用ajax進行傳輸。
json語法規則:
1.數據在名稱/值對中
2.數據有逗號分隔
3.花括號保存對象{}
4.方括號保存數組[]
JSON 名稱/值對
JSON 數據的書寫格式是:名稱/值對。
名稱/值對包括字段名稱(在雙引號中),後面寫一個冒號,然後是值:
"firstName" : "John"
這很容易理解,等價於這條 JavaScript 語句:
firstName = "John"
json值可以是:
1.數字(整數或浮點數)
2.字符串(在雙引號中)
3.邏輯值(true或則false)
4.數組在方括號中
5.對象在花括號中
6.null
JSON 對象
json對象在花括號中書寫,對象可以包含多個名稱/值對
{ "firstName":"John" , "lastName":"Doe" }
這一點也容易理解,與這條 JavaScript 語句等價:
firstName = "John" lastName = "Doe"
JSON 數組
json數組在方括號中書寫,
{
"employees":[
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}
在上面的例子中emploees數組中包含3個對象,每個對象代表一條關於某人(有姓和名)的記錄。
JSON 使用 JavaScript 語法
因爲 JSON 使用 JavaScript 語法,所以無需額外的軟件就能處理 JavaScript 中的 JSON。
通過 JavaScript,您可以創建一個對象數組,並像這樣進行賦值:
var employees = [
{ "firstName":"Bill" , "lastName":"Gates" },
{ "firstName":"George" , "lastName":"Bush" },
{ "firstName":"Thomas" , "lastName": "Carter" }
];
可以像這樣訪問 JavaScript 對象數組中的第一項:
employees[0].lastName;
返回的內容是:
Gates
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>通過json對象來創建對象</title>
</head>
<body> <p> aaa<span id="nameAndAge"></span> </p> <script type="text/javascript"> var employees=[ {"name":"jt1","age":"18"}, {"name":"jt2","age":"19"}, {"name":"jt3","age":"20"} ]; alert(employees[0].age); employees[0].age=30; alert(employees[0].age); document.getElementById("nameAndAge").innerHTML=11; </script> </body> </html>
JSON 解析器
提示:eval() 函數可編譯並執行任何 JavaScript 代碼。這隱藏了一個潛在的安全問題。
使用 JSON 解析器將 JSON 轉換爲 JavaScript 對象是更安全的做法。JSON 解析器只能識別 JSON 文本,而不會編譯腳本。
在瀏覽器中,這提供了原生的 JSON 支持,而且 JSON 解析器的速度更快。
較新的瀏覽器和最新的 ECMAScript (JavaScript) 標準中均包含了原生的對 JSON 的支持。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>通過瀏覽器自帶的json解析器解析json字符串</title>
</head>
<body>
<p> name:<span id="name"></span><br/> age:<span id="age"></span> </p> <script type="text/jscript"> var txt='{"employees":['+ '{"name":"jt1","age":"18"},'+ '{"name":"jt2","age":"20"},'+ '{"name":"jt3","age":"30"}]}'; var obj=JSON.parse(txt); var name=document.getElementById("name").innerHTML=obj.employees[0].name+" "; document.getElementById("age").innerHTML=obj.employees[1].age; </script>
</body> </html>