一、什么是JSON？

1、JSON（JavaScript Object Notation）：JavaScript 对象表示法
2、JSON 是是轻量级的文本数据交换格式。类似 XML，但 比 XML 更小、更快，更易解析。
3、JSON 独立于语言：JSON 使用 Javascript语法来描述数据对象，但是 JSON 仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。 目前非常多的动态（PHP，JSP，.NET）编程语言都支持JSON。
4、JSON 具有自我描述性，更易理解
（以上段落摘自菜鸟）

二、JSON的语法规则

JSON的类型：
对象型、数组型（数组中可以包含多个对象）

JSON的语法规则：

数据在名称/值对中

"key":"value"

数据由逗号分隔

{}

保存对象

[]

保存数组

JSON值的类型：

数字
字符串
Boolean（true 或 false）
数组
对象
null

JSON文件：

JSON 文件的文件类型是 “.json”
JSON 文本的 MIME 类型是 “application/json”

备注：以上摘自菜鸟

举例：
建立单个JSON

var res = {
"name": "张三",
"sex": "男",
"age": 18,
"hobby": [
{
"name": "篮球"
},
{
"name": "足球"
},
{
"name": "羽毛球"
}
]
};

集合类型的JSON

var list = [
{
"id": "10001",
"name": "陕西省",
"child": [
{
"id": "100011",
"name": "宝鸡市"
},
{
"id": "100012",
"name": "宝鸡市"
}
]
},
{
"id": "10002",
"name": "甘肃省",
"child": [
{
"id": "100021",
"name": "酒泉"
},
{
"id":"100022",
"name":"兰州"
}
]
}
];

三、JSON字符串和JSON对象相互转换

JSON 通常用于与服务端交换数据，接收到的服务器数据一般是字符串，但JavaScript 中一般使用的是JSON对象，所以就需要相互转换。转换方法如下：

JSON.stringify();

JSON对象转化为JSON字符串

JSON.parse();

字符串JSON转化为JSON对象

举例：

var str=JSON.stringify(list);
console.log(str);   //字符串
console.log(JSON.parse(str));    //对象

四、JSON数据的使用

JSON数据导入HTML元素的方法：
1、直接使用变量

<span>姓名：</span><span id="name"></span>
<span>性别：</span><span id="sex"></span>
<script>
var person={
"name":"张三",
"sex":"男"
}
document.querySelector("#name").innerHTML=person.name;
document.querySelector("#sex").innerHTML=person.sex;
</script>

2、拼接字符串的方式

<ul id="menu"></ul>
<script>
var data=[
{
"name":"李四"
},
{
"name":"张三"
},
{
"name":"王五"
}
];

var str="";
for(var i=0;i<data.length;i++)
{
str+="<li>"+data[i].name+"</li>";
}
document.querySelector("#menu").innerHTML=str;
</script>