js 解析 JSON 數(shù)據(jù)簡(jiǎn)單示例
本文實(shí)例講述了js 解析 JSON 數(shù)據(jù)。分享給大家供大家參考,具體如下:
JSON 數(shù)據(jù)如下:
{
"name": "mkyong",
"age": 30,
"address": {
"streetAddress": "88 8nd Street",
"city": "New York"
},
"phoneNumber": [
{
"type": "home",
"number": "111 111-1111"
},
{
"type": "fax",
"number": "222 222-2222"
}
]
}
要在JavaScript中訪問JSON對(duì)象,使用 JSON.parse() 解析它,并通過“.”或“[]”訪問。
JS 代碼如下:
<script>
var data = '{"name": "mkyong","age": 30,"address": {"streetAddress": "88 8nd Street","city": "New York"},"phoneNumber": [{"type": "home","number": "111 111-1111"},{"type": "fax","number": "222 222-2222"}]}';
var json = JSON.parse(data);
console.log(json["name"]); //mkyong
console.log(json.name); //mkyong
console.log(json.address.streetAddress); //88 8nd Street
console.log(json["address"].city); //New York
console.log(json.phoneNumber[0].number); //111 111-1111
console.log(json.phoneNumber[1].type); //fax
console.log(json.phoneNumber.number); //undefined
</script>
運(yùn)行結(jié)果:

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具:http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。
PS:關(guān)于json操作,這里再為大家推薦幾款比較實(shí)用的json在線工具供大家參考使用:
在線JSON代碼檢驗(yàn)、檢驗(yàn)、美化、格式化工具:
http://tools.jb51.net/code/json
JSON在線格式化工具:
http://tools.jb51.net/code/jsonformat
在線XML/JSON互相轉(zhuǎn)換工具:
http://tools.jb51.net/code/xmljson
json代碼在線格式化/美化/壓縮/編輯/轉(zhuǎn)換工具:
http://tools.jb51.net/code/jsoncodeformat
在線json壓縮/轉(zhuǎn)義工具:
http://tools.jb51.net/code/json_yasuo_trans
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題:《JavaScript中json操作技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
Bootstrap基本樣式學(xué)習(xí)筆記之圖片(6)
這篇文章主要介紹了Bootstrap學(xué)習(xí)筆記之圖片基本樣式的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12
JS動(dòng)態(tài)創(chuàng)建DOM元素的方法
這篇文章主要介紹了JS動(dòng)態(tài)創(chuàng)建DOM元素的方法,涉及javascript動(dòng)態(tài)創(chuàng)建DOM元素及DOM元素事件綁定與刪除的相關(guān)技巧,需要的朋友可以參考下2015-06-06
BootStrap 圖片樣式、輔助類樣式和CSS組件的實(shí)例詳解
這篇文章主要介紹了BootStrap 圖片樣式、輔助類樣式和CSS組件的實(shí)現(xiàn)代碼,圖文并茂介紹的非常詳細(xì),需要的朋友參考下吧2017-01-01
js設(shè)置文本框中焦點(diǎn)位置在最后的示例代碼(簡(jiǎn)單實(shí)用)
本篇文章主要是對(duì)js設(shè)置文本框中焦點(diǎn)位置在最后的示例代碼進(jìn)行了介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2014-03-03
javascript學(xué)習(xí)隨筆(使用window和frame)的技巧
javascript學(xué)習(xí)隨筆(使用window和frame)的技巧...2007-03-03
JavaScript 隨機(jī)驗(yàn)證碼的生成實(shí)例代碼
這篇文章主要介紹了JavaScript 隨機(jī)驗(yàn)證碼的生成實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下2016-09-09

