<!DOCTYPE html>

 <html>

     <head>

         <meta charset="utf-8">

         <title></title>

     </head>

     <body>

         <p>

             name:<span id="name"></span><br />

             address:<span id="address"></span><br />

             age:<span id="age"></span><br />

             phone:<span id="phone"></span>

         </p>

         <p>

             json数组1：

             <span id="arrJson1"></span><br />

             json数组2：

             <span id="arrJson2"></span>

         </p>

         <p>

             First Name: <span id="fname"></span><br />

             Last Name: <span id="lname"></span><br />

         </p>

     </body>

     <script type="text/javascript">

         //普通json对象定义

         var stus={

             "name":"bill",

             "address":"Shenzhen",

             "age":25,

             "phone":110

         };

         document.getElementById("name").innerText=stus.name;

         document.getElementById("address").innerHTML=stus.address;

         document.getElementById("age").innerText=stus.age;

         document.getElementById("phone").innerText=stus.phone;

         //json数组

         var arrJson = {

             "employees": [{

                 "firstName": "John",

                 "lastName": "Doe"

             }, {

                 "firstName": "Anna",

                 "lastName": "Smith"

             }, {

                 "firstName": "Peter",

                 "lastName": "Jones"

             }]

         }

         document.getElementById("arrJson1").innerText=arrJson.employees[0].firstName +" "+ arrJson.employees[0].lastName;

         document.getElementById("arrJson2").innerText=arrJson.employees[1].firstName +" "+ arrJson.employees[1].lastName;

         //创建json语法的js字符串

         var txt = '{ "employees" : [' +

             '{ "firstName":"Bill" , "lastName":"Gates" },' +

             '{ "firstName":"George" , "lastName":"Bush" },' +

             '{ "firstName":"Thomas" , "lastName":"Carter" } ]}';

         //eval() 函数使用的是 JavaScript 编译器，可解析 JSON 文本，然后生成 JavaScript 对象。必须把文本包围在括号中，这样才能避免语法错误：

         var obj=eval("("+txt+")");

         obj.employees[0].firstName=obj.employees[1].firstName;

         obj.employees[0].lastName=obj.employees[1].lastName;

         document.getElementById("fname").innerHTML=obj.employees[0].firstName;

         document.getElementById("lname").innerHTML = obj.employees[0].lastName;

     </script>

 </html>

json学习小记的更多相关文章

  1. logstash 学习小记

    logstash 学习小记 标签(空格分隔): 日志收集 Introduce Logstash is a tool for managing events and logs. You can use ...

  2. mongodb入门学习小记

    Mongodb 简单入门(个人学习小记) 1.安装并注册成服务:(示例) E:\DevTools\mongodb3.2.6\bin>mongod.exe --bind_ip 127.0.0.1 ...

  3. javascript学习小记（一）

    大四了,课少了许多,突然之间就不知道学什么啦.整天在宿舍混着日子,很想学习就是感觉没有一点头绪,昨天看了电影激战.这种纠结的情绪让我都有点喘不上气啦!一点要找点事情干了,所以决定找个东西开始学习.那就 ...

  4. js 正则学习小记之匹配字符串

    原文:js 正则学习小记之匹配字符串 今天看了第5章几个例子,有点收获,记录下来当作回顾也当作分享. 关于匹配字符串问题,有很多种类型,今天讨论 js 代码里的字符串匹配.(因为我想学完之后写个语法高 ...

  5. js 正则学习小记之左最长规则

    原文:js 正则学习小记之左最长规则 昨天我在判断正则引擎用到的方法是用 /nfa|nfa not/ 去匹配 "nfa not",得到的结果是 'nfa'.其实我们的本意是想得到整 ...

  6. js 正则学习小记之NFA引擎

    原文:js 正则学习小记之NFA引擎 之前一直认为自己正则还不错,在看 次碳酸钴,Barret Lee 等大神都把正则玩的出神入化后发现我只是个战五渣.  求抱大腿,求大神调教. 之前大致有个印象,正 ...

  7. js 正则学习小记之匹配字符串优化篇

    原文:js 正则学习小记之匹配字符串优化篇 昨天在<js 正则学习小记之匹配字符串>谈到 个字符,除了第一个 个,只有 个转义( 个字符),所以 次,只有 次成功.这 次匹配失败,需要回溯 ...

  8. CSS学习小记

    搜狗主页页面CSS学习小记 1.边框的处理   要形成上图所示的布局效果,即,点选后,导航下面的边框不显示而其他的边框形成平滑的形状.相对于把导航的下面边框取消然后用空白覆盖掉下面搜索栏的边框比较而言 ...

  9. Gcd&Exgcd算法学习小记

    Preface 对于许多数论问题,都需要涉及到Gcd,求解Gcd,常常使用欧几里得算法,以前也只是背下来,没有真正了解并证明过. 对于许多求解问题,可以列出贝祖方程:ax+by=Gcd(a,b),用E ...

随机推荐

  1. 重写(Override)与重载(Overload)

    重写(Override) 重写是子类对父类的允许访问的方法的实现过程进行重新编写, 返回值和形参都不能改变.即外壳不变,核心重写! 重写的好处在于子类可以根据需要,定义特定于自己的行为. 也就是说子类 ...

  2. Daily Scrum 11.2

    由于11月1号是周六,小组里人不是很齐,所以Scrum会议暂停一次. 周日大家的工作都已经进入到尾声了,但是由于人员方面出现一些问题,界面方面做的还不到位.鉴于我们还只是完成了一个比较简单的工作,与真 ...

  3. ASPCMS标签教程

    导航栏调用{aspcms:navlist type=0}    <a href="[navlist:link]">[navlist:name]</a>{/a ...

  4. linux笔记六-------文件权限设置

    1.文件(目录)权限本身划分:读read   写write   执行execute 权限从用户的角度划分:主人权限user    同组用户权限group    其他组用户的权限other music. ...

  5. Sql Server按树形结构排序查询表记录

    http://blog.csdn.net/dxnn520/article/details/8089149 ----------------------------------------------- ...

  6. zju(2)vivi的配置编译和固化

    1.实验目的 熟悉vivi的知识和应用并使用交叉编译平台vivi引导并烧写到目标板. 二.实验内容 1． 在Ubuntu下配置vivi并进行交叉编译: 2． 将编译好的vivi烧写到目标板上. 三.主 ...

  7. 类似input框内最右边添加图标，有清空功能

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  8. IO 磁盘总结

    IO 磁盘 1.读取 首先引用一个using System.IO;引用空间其次 string ste= File.ReadAllText("E:\\bt.txt",Encoding ...

  9. LaTex 插入图片

    \usepackage{mathrsfs} \usepackage{amsmath} \usepackage{graphicx} 宏包 \includegraphics{graph01.eps} %插 ...

  10. mysql5.5手册读书日记(2)

    <?php /* * * MySQL_5.5中文参考手册 485开始 * * mysql> SELECT CASE 1 WHEN 1 THEN 'one' -> WHEN 2 THE ...