<!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. Android App截包工具

    用于分析App通过网络与服务器交互的过程,至于教程,网上很多,软件叫Fiddler

  2. Oracle中建表和指定表空间

    --建一个表create table HH2( tid number primary key ,--主键设定 tname varchar2(20) ); --删除表drop table HH; --表 ...

  3. wamp下多域名配置

    1.找到wamp安装目录的apache安装目录 找到 httpd.conf文件 例如我安装的目录为 E:\wamp\bin\apache\apache2.2.8\conf\httpd.conf 也可以 ...

  4. SQL serve 聚合函数、字符串函数

    1.聚合函数 sum,avg,max,min,count        having后面只能跟聚合函数 2.数学函数和字符串函数 3.练习: 1)新建一个学生信息表,根据问题写出程序. 2)新建一个超 ...

  5. js 原生 ajax 异步上传图片

    <script type="text/javascript"> function upload() { var file1 = document.getElementB ...

  6. vbox下Oracle Enterprise liunx5.4虚拟机安装10G RAC实验(三)

    接第二篇 http://www.cnblogs.com/myrunning/p/3996183.html 4.安装集群软件 4.1验证安装环境 经过检查发现以下3个包检查未通过: compat-gcc ...

  7. 文件上传插件 -- plupload

    refresh:重新实例化uploader removeFile(id):从file中移除某个文件 splice(start,length):从队列中start开始删除length个文件, 返回被删除 ...

  8. windows用户用VMware 虚拟机安装黑苹果Mac.OS.X操作系统

    使用的操作系统操作系统 windows7 SP1 X64 本教程所用 的软件的下载地址都在本教程中 ) 电脑内存低于 4G 的,加内存吧 … 1. SecurAble (检测你的 CPU 是否支持硬件 ...

  9. # 20145334赵文豪 《Java程序设计》第5周学习总结

    20145334赵文豪 <Java程序设计>第5周学习总结 教材学习内容总结 第八章 1.使用try.catch打包System.in.read(),声明throws java.io.IO ...

  10. Lua语言

    下载使用Subline作为编辑器 1. 2.函数使用 function sayHello() print ('hello torch') end 3.定义变量 a print (a) 4.引入文件 r ...