JSON 入門教程基礎(chǔ)篇 json入門學(xué)習(xí)筆記
JSON: JavaScript Object Notation(JavaScript 對象表示法)
JSON 是存儲和交換文本信息的語法。類似 XML。
JSON 比 XML 更小、更快，更易解析。
JSON 實例
{
"sites": [
{ "name":"腳本之家" , "url":"www.dbjr.com.cn" },
{ "name":"google" , "url":"www.google.com" },
{ "name":"微博" , "url":"www.weibo.com" }
]
}
這個 sites 對象是包含 3 個站點記錄（對象）的數(shù)組。
什么是 JSON ？
JSON 指的是 JavaScript 對象表示法（JavaScript Object Notation）
JSON 是輕量級的文本數(shù)據(jù)交換格式
JSON 獨立于語言：JSON 使用 Javascript語法來描述數(shù)據(jù)對象，但是 JSON 仍然獨立于語言和平臺。JSON 解析器和 JSON 庫支持許多不同的編程語言。 目前非常多的動態(tài)（PHP，JSP，.NET）編程語言都支持JSON。
JSON 具有自我描述性，更易理解
JSON - 轉(zhuǎn)換為 JavaScript 對象
JSON 文本格式在語法上與創(chuàng)建 JavaScript 對象的代碼相同。
由于這種相似性，無需解析器，JavaScript 程序能夠使用內(nèi)建的 eval() 函數(shù)，用 JSON 數(shù)據(jù)來生成原生的 JavaScript 對象。
在線實例
通過我們的編輯器，您可以在線編輯 JavaScript 代碼，然后通過點擊一個按鈕來查看結(jié)果：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>腳本之家(jb51.net)</title>
</head>
<body>
<h2>JavaScript 創(chuàng)建 JSON 對象</h2>
<p>
網(wǎng)站名稱: <span id="jname"></span><br />
網(wǎng)站地址: <span id="jurl"></span><br />
網(wǎng)站 slogan: <span id="jslogan"></span><br />
</p>
<script>
var JSONObject= {
"name":"腳本之家",
"url":"www.dbjr.com.cn",
"slogan":"學(xué)的不僅是技術(shù)，更是夢想！"
};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jurl").innerHTML=JSONObject.url
document.getElementById("jslogan").innerHTML=JSONObject.slogan
</script>
</body>
</html>
與 XML 相同之處
JSON 是純文本
JSON 具有"自我描述性"（人類可讀）
JSON 具有層級結(jié)構(gòu)（值中存在值）
JSON 可通過 JavaScript 進行解析
JSON 數(shù)據(jù)可使用 AJAX 進行傳輸
與 XML 不同之處
沒有結(jié)束標(biāo)簽
更短
讀寫的速度更快
能夠使用內(nèi)建的 JavaScript eval() 方法進行解析
使用數(shù)組
不使用保留字
為什么使用 JSON？
對于 AJAX 應(yīng)用程序來說，JSON 比 XML 更快更易使用：
使用 XML
讀取 XML 文檔
使用 XML DOM 來循環(huán)遍歷文檔
讀取值并存儲在變量中
使用 JSON
讀取 JSON 字符串
用 eval() 處理 JSON 字符串
JSON 語法
JSON 語法是 JavaScript 語法的子集。
JSON 語法規(guī)則
JSON 語法是 JavaScript 對象表示語法的子集。
數(shù)據(jù)在名稱/值對中
數(shù)據(jù)由逗號分隔
大括號保存對象
中括號保存數(shù)組
JSON 名稱/值對
JSON 數(shù)據(jù)的書寫格式是：名稱/值對。
名稱/值對包括字段名稱（在雙引號中），后面寫一個冒號，然后是值：
"name" : "腳本之家"
這很容易理解，等價于這條 JavaScript 語句：
name = "腳本之家"
JSON 值
JSON 值可以是：
數(shù)字（整數(shù)或浮點數(shù)）
字符串（在雙引號中）
邏輯值（true 或 false）
數(shù)組（在中括號中）
對象（在大括號中）
null
JSON 數(shù)字
JSON 數(shù)字可以是整型或者浮點型：
{ "age":30 }
JSON 對象
JSON 對象在大括號（{}）中書寫：
對象可以包含多個名稱/值對：
{ "name":"腳本之家" , "url":"www.dbjr.com.cn" }
這一點也容易理解，與這條 JavaScript 語句等價：
name = "腳本之家"
url = "www.dbjr.com.cn"
JSON 數(shù)組
JSON 數(shù)組在中括號中書寫：
數(shù)組可包含多個對象：
{
"sites": [
{ "name":"腳本之家" , "url":"www.dbjr.com.cn" },
{ "name":"google" , "url":"www.google.com" },
{ "name":"微博" , "url":"www.weibo.com" }
]
}
在上面的例子中，對象 "sites" 是包含三個對象的數(shù)組。每個對象代表一條關(guān)于某個網(wǎng)站（name、url）的記錄。
JSON 布爾值
JSON 布爾值可以是 true 或者 false：
{ "flag":true }
JSON null
JSON 可以設(shè)置 null 值：
{ "jb51":null }
JSON 使用 JavaScript 語法
因為 JSON 使用 JavaScript 語法，所以無需額外的軟件就能處理 JavaScript 中的 JSON。
通過 JavaScript，您可以創(chuàng)建一個對象數(shù)組，并像這樣進行賦值：
var sites = [
{ "name":"jb51" , "url":"www.jb51.com" },
{ "name":"google" , "url":"www.google.com" },
{ "name":"微博" , "url":"www.weibo.com" }
];
可以像這樣訪問 JavaScript 對象數(shù)組中的第一項（索引從 0 開始）：
sites[0].name;
返回的內(nèi)容是：
jb51
可以像這樣修改數(shù)據(jù)：
sites[0].name="腳本之家";
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>腳本之家(jb51.com)</title>
</head>
<body>
<h2>JavaScript 創(chuàng)建 JSON 對象</h2>
<p>第一個網(wǎng)站名稱: <span id="name1"></span></p>
<p>第一個網(wǎng)站修改后的名稱: <span id="name2"></span></p>
<script>
var sites = [
{ "name":"jb51" , "url":"www.jb51.com" },
{ "name":"google" , "url":"www.google.com" },
{ "name":"微博" , "url":"www.weibo.com" }
];
document.getElementById("name1").innerHTML=sites[0].name;
// 修改網(wǎng)站名稱
sites[0].name="腳本之家";
document.getElementById("name2").innerHTML=sites[0].name;
</script>
</body>
</html>
在下面的章節(jié)，您將學(xué)到如何把 JSON 文本轉(zhuǎn)換為 JavaScript 對象。
JSON 文件
JSON 文件的文件類型是 ".json"
JSON 文本的 MIME 類型是 "application/json"
JSON vs XML
JSON 和 XML 都用于接收 web 服務(wù)端的數(shù)據(jù)。
JSON 和 XML在寫法上有所不同，如下所示：
JSON 實例
{
"sites": [
{ "name":"腳本之家" , "url":"www.jb51.com" },
{ "name":"google" , "url":"www.google.com" },
{ "name":"微博" , "url":"www.weibo.com" }
]
}
XML 實例
<sites> <site> <name>腳本之家</name> <url>www.jb51.com</url> </site> <site> <name>google</name> <url>www.google.com</url> </site> <site> <name>微博</name> <url>www.weibo.com</url> </site> </sites>
JSON 與 XML 的相同之處：
JSON 和 XML 數(shù)據(jù)都是 "自我描述" ，都易于理解。
JSON 和 XML 數(shù)據(jù)都是有層次的結(jié)構(gòu)
JSON 和 XML 數(shù)據(jù)可以被大多數(shù)編程語言使用
JSON 與 XML 的不同之處：
JSON 不需要結(jié)束標(biāo)簽
JSON 更加簡短
JSON 讀寫速度更快
JSON 可以使用數(shù)組
最大的不同是：XML 需要使用 XML 解析器來解析，JSON 可以使用標(biāo)準(zhǔn)的 JavaScript 函數(shù)來解析。
JSON.parse(): 將一個 JSON 字符串轉(zhuǎn)換為 JavaScript 對象。
JSON.stringify(): 于將 JavaScript 值轉(zhuǎn)換為 JSON 字符串。
為什么 JSON 比 XML 更好？
XML 比 JSON 更難解析。
JSON 可以直接使用現(xiàn)有的 JavaScript 對象解析。
針對 AJAX 應(yīng)用，JSON 比 XML 數(shù)據(jù)加載更快，而且更簡單：
使用 XML
獲取 XML 文檔
使用 XML DOM 迭代循環(huán)文檔
接數(shù)據(jù)解析出來復(fù)制給變量
使用 JSON
獲取 JSON 字符串
JSON.Parse 解析 JSON 字符串
相關(guān)文章
json的定義、標(biāo)準(zhǔn)格式及json字符串檢驗
今天分享和總結(jié)一些json的基本定義、格式、字符串的格式，以及在做測試的時候使用json時做一些簡單的校驗2014-05-05
JSON.parse 數(shù)據(jù)不完整的解決方法
本文主要介紹了JSON.parse 數(shù)據(jù)不完整的解決方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07
主要還是通過遞歸和迭代來遍歷json成員生成html元素 ,比較好的是num能制定循環(huán)次數(shù)可以少寫很多代碼.具體應(yīng)用看場景了2010-04-04
比較詳細(xì)的關(guān)于javascript 解析json的代碼
JSON （JavaScript Object Notation）一種簡單的數(shù)據(jù)格式，比xml更輕巧。 JSON 是 JavaScript 原生格式，這意味著在 JavaScript 中處理 JSON 數(shù)據(jù)不需要任何特殊的 API 或工具包。2009-12-12
javascript表單域與json數(shù)據(jù)間的交互
找了幾個javascript的框架，都沒有找到我想要的： 提供函數(shù)，把某個表單的所有域封裝成json數(shù)據(jù)格式的對象，唯有自己實現(xiàn)一個。2008-10-10
JQuery用$.ajax或$.getJSON跨域獲取JSON數(shù)據(jù)的實現(xiàn)代碼
這篇文章主要介紹了JQuery用$.ajax或$.getJSON跨域獲取JSON數(shù)據(jù)的實現(xiàn)代碼,需要的朋友可以參考下2017-09-09
通常情況下,json的在項目中的應(yīng)用都是在后臺把數(shù)據(jù)傳到前臺,然后前臺再獲取json中的數(shù)據(jù).2012-01-01
說到AJAX就會不可避免的面臨兩個問題，第一個是AJAX以何種格式來交換數(shù)據(jù)？第二個是跨域的需求如何解決2012-09-09
在異步應(yīng)用程序中發(fā)送和接收信息時，可以選擇以純文本和 XML 作為數(shù)據(jù)格式。掌握 Ajax 的這一期討論另一種有用的數(shù)據(jù)格式 JavaScript Object Notation（JSON），以及如何使用它更輕松地在應(yīng)用程序中移動數(shù)據(jù)和對象。2009-10-10
若使用json作為客戶端和服務(wù)器之間的數(shù)據(jù)交換格式，代替原來的html交換格式。2010-06-06