<!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. ado.net 属性扩展 综合练习

    实现数据查询,添加,删除,修改各项功能 业务逻辑层: using System; using System.Collections.Generic; using System.Linq; using ...

  2. ThinkPHP的URL优化

    在刚刚安装好tp框架时,我们的路径一般是这样的: http://localhost/index.php/Home/Index/index?name=cly 我们可以通过下面一步步的步骤来优化这个路径 ...

  3. parentNode，offsetParent

    元素.parentNode : 父节点   只读 属性 当前节点的父级节点 没有兼容性问题 可放心使用 <!DOCTYPE HTML> <html> <head> ...

  4. tomcat域名问题

    首先可以确认,tomcat支持以下的配置: 1.同一个tomcat配置多个端口来发布不同的应用,配置多个<Service>即可; 2.同一个tomcat可以配置多个虚拟主机,以指定不同的域 ...

  5. hadoop-1.2.1安装配置

    1.准备三台节点 hnd1  hnd2  hnd3 下载 hadoop 下载地址:http://apache.fayea.com/hadoop/common/ API文档:http://hadoop. ...

  6. android之消息机制（二）

    消息通道:Looper 首先编写main.xml文件 代码如下: <LinearLayout xmlns:android="http://schemas.android.com/apk ...

  7. SpringBoot实例

    7player 7号球员 -- Show Time !跳至内容 首发 左边锋 技术流 外援 教练 7号 基于SpringBoot + Mybatis实现SpringMVC Web项目[原创] 目录 [ ...

  8. 西部数据出现“WD SES Device USB Device”怎么办，而且说明书全是英文。

    您好.wd ses device driver这个驱动程序可以在baidu中输入关键词找到,什么驱动之家.驱动人生之类的专业驱动网站也都是有的. western digital的移动硬盘驱动程序安装步 ...

  9. 使用LVM对硬盘在线扩容

    初始状态: root@control:/dev/nova-volumes# vgdisplay --- Volume group --- VG Name nova-volumes System ID ...

  10. Final-阶段站立会议4

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