JSON的使用说明

1. JSON：JavaScript Object Notation //javascript对象表示法的缩写
2. 总是来说它的一种存储文件的语法，类似XML，但它比后者更小，更快，而且除JS外，PHP/python/C/C++,Java等都支持它
3. JSON是纯文本，有自我描述性，有层级结构(值中值)，可通过AJAX传输，比XML更快，没有结束标签，没有保留字

JSON的语法
1) 一条数据包括键和值，多条数据之间用逗号分隔，对象放在大括号中{}，数组放在方括号中
例：
<script>
var sites = [  //sites是一个有三个对象的数组
 { "name":"runoob" , "url":"www.runoob.com" }, //对象及数组的值都用逗号隔开
 { "name":"google" , "url":"www.google.com" },
 { "name":"微博" , "url":"www.weibo.com" }
];

document.getElementById("name1").innerHTML=sites[0].name;  //这里的name可以改为url
sites[0].name="菜鸟教程"; //数组是有序是可通过索引改变值
document.getElementById("name2").innerHTML=sites[0].name;
</script>

JSON的嵌套
<script>
myObj = {
 "name":"runoob",
 "alexa":10000,
 "sites": {
  "site1":"www.runoob.com",
  "site2":"m.runoob.com",
  "site3":"c.runoob.com"
 }
}
document.getElementById("demo").innerHTML += myObj.sites.site1 + "<br>";
// 或者
document.getElementById("demo").innerHTML += myObj.sites["site1"];
</script>

循环输出JSON的每个键或值
<script>
var myObj = { "name":"runoob", "alexa":10000, "site":null };
for (x in myObj) {
    document.getElementById("demo").innerHTML += x + "<br>";
}
for (x in myObj) {
 document.getElementById("demo").innerHTML += myObj[x] + "<br>";
}
</script>

循环输入内嵌数组
<script>
var myObj, i, j, x = "";
myObj = {
    "name":"网站",
    "num":3,
    "sites": [
        { "name":"Google", "info":[ "Android", "Google 搜索", "Google 翻译" ] },
        { "name":"Runoob", "info":[ "菜鸟教程", "菜鸟工具", "菜鸟微信" ] },
        { "name":"Taobao", "info":[ "淘宝", "网购" ] }
    ]
}
for (i in myObj.sites) {
    x += "<h1>" + myObj.sites[i].name + "</h1>";
    for (j in myObj.sites[i].info) {
        x += myObj.sites[i].info[j] + "<br>";
    }
}
document.getElementById("demo").innerHTML = x;
</script>

数组值的修改与删除
myObj.sites[1] = "Github";
delete myObj.sites[1];

JSON的parse()与stringify()两函数区别
1)JSON主要用于与服务端交换数据，从服务器接收到的JSON本质上一个字符串
2)可以理解为parse()用以将json字串转为JS可操作的对象，而stringify用以将JS对象转为可传输的字串
例：
<script>
var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');
document.getElementById("demo").innerHTML = obj.name + "：" + obj.site;
</script>

例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<h2>JavaScript 创建 JSON 对象</h2>
<p>
网站名称: <span id="jname"></span><br />
网站地址: <span id="jurl"></span><br />
网站 slogan: <span id="jslogan"></span><br />
</p>
<script>
var JSONObject= {
    "name":"菜鸟教程",
    "url":"www.runoob.com",
    "slogan":"学的不仅是技术，更是梦想！"
};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jurl").innerHTML=JSONObject.url
document.getElementById("jslogan").innerHTML=JSONObject.slogan
</script>
 
</body>
</html>