一、什么是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>
更多推荐
后端接口返回给前端的数据格式JSON——0526笔记整理
发布评论