<!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. crontab的坑

    1. 命令  全路径 (eg:which mysql) 2.执行脚本  (脚本中加上#!/bin/bash) eg: /bin/bash script.sh 3. 输出信息(>>) 使用全 ...

  2. WOFF mime类型

    WOFF fonts,国外网站很多调用了.woff字体文件,IIS默认不支持,所以会报错404,只需要添加扩展MIME类型mime类型是:application/x-font-woff.

  3. Runtime Error---Description: An application error occurred on the server....

    [原]Runtime Error---Description: An application error occurred on the server.... 2010-1-7阅读2010 评论3 D ...

  4. zju(8)串口通信实验

    1.实验目的 1.学习和掌握linux下串口的操作方法以及应用程序的编写: 二.实验内容 1．编写EduKit-IV实验箱Linux操作系统下串口的应用程序,运行时只需要将串口线的一端连接到开发板的c ...

  5. BizTalk动手实验（十五）AS2消息安全传输

    1 课程简介 本课程将配置AS2相关的安全传输配置,学员可以通过本课程熟悉相关的安全配置. 2 准备工作 为了模拟实际的B2B交互过程,本实验需要2台BizTalk Server 2010虚拟机(两两 ...

  6. 详解 Python 中的下划线命名规则

    在 python 中,下划线命名规则往往令初学者相当 疑惑:单下划线.双下划线.双下划线还分前后……那它们的作用与使用场景 到底有何区别呢?今天 就来聊聊这个话题. 1.单下划线(_) 通常情况下,单 ...

  7. Final-阶段站立会议3

    组名:天天向上 组长:王森 组员:张政.张金生.林莉.胡丽娜 代码地址:HTTPS:https://git.coding.net/jx8zjs/llk.git SSH:git@git.coding.n ...

  8. SQL ORDER BY 子句

    ORDER BY 语句用于对结果集进行排序. ORDER BY 语句 ORDER BY 语句用于根据指定的列对结果集进行排序. ORDER BY 语句默认按照升序对记录进行排序. 如果您希望按照降序对 ...

  9. 通过 Chrome Workspace 调试本地项目(修改样式时及时保存)

    打开 DevTools 开发者工具[F12]中的 Sources 面板,在面板左侧右键选择「Add folder to workspace」,选择添加的文件夹. 添加好后,右键一个文件,选择「Map ...

  10. toggle函数

    $(function() { $('.love').toggle(function() { $(this).attr("src", "images/loved.png&q ...