本笔记来自W3School,并不全面,日后应当在实际应用中补充
实例
<html>
<body>
<h2>在JavaScript中创建JSON对象</h2>
<p>
Name: <span id="jname"></span><br/>
Age: <span id="jage"></span><br/>
Address: <span id="jstreet"></span><br/>
Phone: <span id="jphone"></span><br/>
</p>
<script type="text/javascript">
var JSONObject={
"name":"Bill Gates",
"street":"Fifth Avenue New York 666",
"age":56,
"phone":"555 1234567"
};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jage").innerHTML=JSONObject.age
document.getElementById("jstreet").innerHTML=JSONObject.street
document.getElementById("jphone").innerHTML=JSONObject.phone
</script>
</body>
</html>
与XML的比较
同:
● JSON是纯文本
● JSON具有“自我描述性“(人类可读)
● JSON具有层级结构(值中存在值)
● JSON可通过JavaScript进行解析
● JSON数据可使用Ajax进行传输
异:
● 没有结束标签
● 更短
● 读写的速度更快
● 能够使用内建的JavaScript eval()方法进行解析
● 使用数组
● 不使用保留字
JSON语法
● 数据在名称/值中:"firstName":"John" <=>firstName="John"
● 数据由逗号分隔
● 花括号保存对象
● 方括号保存数组
JSON值可以是:
数字:整数或浮点数
字符串:用双引号阔起来
逻辑值:true、false
数组:用方括号阔起来-{"colors":[{"name":"红","value":"red"},{"name":"蓝","value":"blue"}]}
对象:用花括号阔起来-{"firstName":"John","lastName":Doe"}
null
JSON文件
● JSON文件的文件类型是.json
● JSON文件的MIME类型是application/json
把JSON文本转换为JavaScript对象
JSON最常见的用法之一,是从Web服务器上读取JSON数据(作为文件或为HttpRequest),将JSON数据转换为Javascript对象,然后在网页中使用该数据。下面使用字符串而非文件作为输入演示:
创建Javascript对象:
var txt=‘{"employees":[‘+
‘{"firstName":"John","lastName":"Doe"},‘+
‘{"firstName":"Anna","lastName":"Smith"},‘+
‘{"fistName":"Peter","lastName":"Jones"}]}‘;
var obj=eval("("+txt+")");
在网页中使用Javascript对象:
<p>
First Name: <span id="fname"></span><br/>
Last Name: <span id="lname"></span><br/>
</p>
<script>
document.getElementById("fname").innerHTML=obj.employees[1].firstName
document.getElementById("lname").innerHTML=obj.employees[1].lastName
</script>