如何用1个小时学完 JSON？

时间：2018-03-15 16:19:38 阅读：160 评论：0 收藏：0 [点我收藏+]

标签：employee 存在 targe 数组程序文件的 add ati type

↑↑↑学这个，1个小时够了。下面是节选：

代码例子1：

 1 <html>
 2 <body>
 3 <h2>在 JavaScript 中创建 JSON 对象</h2>
 4 
 5 <p>
 6 Name: <span id="jname"></span><br />
 7 Age: <span id="jage"></span><br />
 8 Address: <span id="jstreet"></span><br />
 9 Phone: <span id="jphone"></span><br />
10 </p>
11 
12 <script type="text/javascript">
13 var JSONObject= {
14 "name":"Bill Gates",
15 "street":"Fifth Avenue New York 666",
16 "age":56,
17 "phone":"555 1234567"};←JSON 可通过 JavaScript 进行解析。
18 document.getElementById("jname").innerHTML=JSONObject.name
19 document.getElementById("jage").innerHTML=JSONObject.age
20 document.getElementById("jstreet").innerHTML=JSONObject.street
21 document.getElementById("jphone").innerHTML=JSONObject.phone
22 </script>
23 
24 </body>
25 </html>

代码例子2：

 1 <html>
 2 <body>
 3 <h2>通过 JSON 字符串来创建对象</h3>
 4 <p>
 5 First Name: <span id="fname"></span><br /> 
 6 Last Name: <span id="lname"></span><br /> 
 7 </p> 
 8 <script type="text/javascript">
 9 var txt = ‘{"employees":[‘ +
10 ‘{"firstName":"Bill","lastName":"Gates" },‘ +
11 ‘{"firstName":"George","lastName":"Bush" },‘ +
12 ‘{"firstName":"Thomas","lastName":"Carter" }]}‘;
13 
14 var obj = eval ("(" + txt + ")");←JavaScript 程序能够使用内建的 eval() 函数，用 JSON 数据来生成原生的 JavaScript 对象。
15 
16 document.getElementById("fname").innerHTML=obj.employees[1].firstName 
17 document.getElementById("lname").innerHTML=obj.employees[1].lastName 
18 </script>
19 </body>
20 </html>

【记忆点】

JSON 文件的文件类型是 ".json"
JSON 文本的 MIME 类型是 "application/json"
JavaScript 程序能够使用内建的 eval() 函数，用 JSON 数据来生成原生的 JavaScript 对象。
JSON 可通过 JavaScript 进行解析。
JSON 最常见的用法之一，是从 web 服务器上读取 JSON 数据（作为文件或作为 HttpRequest），将 JSON 数据转换为 JavaScript 对象，然后在网页中使用该数据。
使用 JSON 解析器将 JSON 转换为 JavaScript 对象是更安全的做法。JSON 解析器只能识别 JSON 文本，而不会编译脚本。
较新的浏览器和最新的 ECMAScript (JavaScript) 标准中均包含了原生的对 JSON 的支持。

类似 XML

JSON 是纯文本
JSON 具有层级结构（值中存在值）
JSON 可通过 JavaScript 进行解析
JSON 数据可使用 AJAX 进行传输