JSON入门实例
json和XML很像,但它具有更快,更小,阅读性强等优点。不多说,直接来例子:
<html>
<body>
<h2>通过 JSON 字符串来创建对象</h3>
<p>
First Name: <span id="fname"></span><br />
Last Name: <span id="lname"></span><br />
</p>
<script type="text/javascript">
var txt = '{"employees":[' +
'{"firstName":"Bill","lastName":"Gates" },' +
'{"firstName":"George","lastName":"Bush" },' +
'{"firstName":"Thomas","lastName":"Carter" }]}';
Var test={"people":[
{"name":"zhoudachuang","age":22},
{"name":"zhangpengpeng"},
{"name":"zhanghua","age":28,"adress":"123"}]};//每个对象的属性值个数可以不一样
//由于 JSON 语法是 JavaScript 语法的子集,JavaScript 函数 eval() 可用于将 JSON 文本转换为 JavaScript 对象。
eval() 函数使用的是 JavaScript 编译器,可解析 JSON 文本,然后生成 JavaScript 对象。必须把文本包围在括号中,这样才能避免语法错误:
var obj = eval ("(" + txt + ")");//将json文本转换成javascript对象
document.getElementById("fname").innerHTML=test.people[0].name
document.getElementById("lname").innerHTML=obj.employees[1].lastName
</script>
</body>
</html>
可以把这段代码直接粘贴,然后执行看效果。
下面是一个json的扩展用法
//对json对象的增删查改操作
//声明json对象
var jsonObj2={persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]};
var persons=jsonObj2.persons;
var str="";
var person={name:"yaoMing",sex:"m",age:"26"};
//以下为json对象的操作,去掉注释可以查看操作结果
//jsonObj2.persons.push(person);//数组最后加一条记录

下面的就不上图了
//jsonObj2.persons.pop();//删除最后一项
//jsonObj2.persons.shift();//删除第一项
jsonObj2.persons.unshift(person);//数组最前面加一条记录 只要适合Javascript的方法都是可以用在JSON对象的数组中的!所以还有另外的方法splice( )进行crud操作! //删除
//jsonObj2.persons.splice(0,2);//开始位置,删除个数
//替换不删除
var self={name:"tom",sex:"m",age:"24"};
var brother={name:"Mike",sex:"m",age:"29"};
jsonObj2.persons.splice(1,0,self,brother,self);//开始位置,删除个数,插入对象
//替换并删除
//jsonObj2.persons.splice(0,1,self,brother);//开始位置,删除个数,插入对象
for(var i=0;i<persons.length;i++){ var cur_person=persons[i]; str+=cur_person.name+"'sex is "+cur_person.sex+" and age is "+cur_person.age+"<br><br>"; }
document.writeln(str);
//转换为json文本
var myjsonobj = JSON.stringify(jsonObj2);
document.writeln(myjsonobj);
JSON入门实例的更多相关文章
- Vue.js2.0从入门到放弃---入门实例
最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中,在网上也搜了很多教程,按着教程来做,也总会出现这样那样的问题(坑啊,由于网上那些教程都是Vue.js 1.x版本的,现在用 ...
- SpringMVC详解(三)------基于注解的入门实例
前两篇博客我们讲解了基于XML 的入门实例,以及SpringMVC运行的详细流程.但是我们发现基于 XML 的配置还是比较麻烦的,而且,每个 Handler 类只能有一个方法,在实际开发中肯定是不可能 ...
- 转载 SpringMVC详解(三)------基于注解的入门实例
目录 1.在 web.xml 文件中配置前端处理器 2.在 springmvc.xml 文件中配置处理器映射器,处理器适配器,视图解析器 3.编写 Handler 4.编写 视图 index.jsp ...
- 转-Vue.js2.0从入门到放弃---入门实例(一)
http://blog.csdn.net/u013182762/article/details/53021374 标签: Vue.jsVue.js 2.0Vue.js入门实例Vue.js 2.0教程 ...
- log4j 2 入门实例(1)
本文介绍log4j的基本概念和将日志输出到控制台的例子. 参考文章: http://www.jianshu.com/p/464058bdbc76 http://www.hankcs.com/progr ...
- TypeScript入门实例
前言 TypeScript是JavaScript的超集,微软公司开发,利用es6语法,实现对js的面向对象编程思想,写代码的时候会像强类型语言一样,指定参数类型.返回值类型,类型不对会报错,但编译后还 ...
- springboot + kafka 入门实例 入门demo
springboot + kafka 入门实例 入门demo 版本说明 springboot版本:2.3.3.RELEASE kakfa服务端版本:kafka_2.12-2.6.0.tgz zooke ...
- Vue项目入门实例
前言 本文记录Vue2.x + Element-UI + TypeScript语法入门实例 为什么要用TypeScript? 1.TypeScript是JavaScript的超集,利用es6语法,实现 ...
- Python导出Excel为Lua/Json/Xml实例教程(三):终极需求
相关链接: Python导出Excel为Lua/Json/Xml实例教程(一):初识Python Python导出Excel为Lua/Json/Xml实例教程(二):xlrd初体验 Python导出E ...
随机推荐
- 【转载】PostgreSQL分区表(Table Partitioning)应用
博客地址--点击
- shell十三问:关于${0##*/} 和${0%/*}
转自shell十三问: http://bbs.chinaunix.net/thread-218853-1-1.html …… 假設我們定義了一個變量為:file=/dir1/dir2/dir3/my ...
- 如何扩大ImageView的点击区域
我们在开发中会遇到,给imageview设置点击事件,但是美工切的原始图片一般在24dp左右,这个尺寸点击时会出现不灵敏的情况(点击区域太小). 解决方案: 给imageView设置 scaleTy ...
- SpringMVC 接收复杂对象
要发送的数据为:String topicId,String topicName,String summarize,List<ModuleParam> parentList 前端页面ajax ...
- PMO究竟啥样?(3)
PMO究竟啥样?(3) 继续上一篇,PMO究竟啥样?到这篇,这篇文章就完毕啦. 超卓基地COE,4大典型责任 我们知道全部的公司,它都是要不断地继续改善和优化,包括公司内安排级的项目处理的机制,也需求 ...
- Robotium中定位Android客户端疑难元素
对于没有id,没有text,只有一个图标的疑难元素(ImageView),应该如何定位呢?拿人人网个人主页的设置按钮举例: 我最终是通过定位页面上可以定位到的其他元素,然后通过其他元素与疑难元素相对坐 ...
- 2016年11月15日 星期二 --出埃及记 Exodus 20:6
2016年11月15日 星期二 --出埃及记 Exodus 20:6 but showing love to a thousand of those who love me and keep my c ...
- 2016年10月11日 星期二 --出埃及记 Exodus 18:22
2016年10月11日 星期二 --出埃及记 Exodus 18:22 Have them serve as judges for the people at all times, but have ...
- IIS7多域名绑定同一物理目录,设置不同默认文档的解决方案
转载自 http://zzstudy.offcn.com/archives/6159 如何解决IIS7多域名绑定同一物理目录,设置不同的默认文档的问题? 因为在一个物理目录下只有一个web.confi ...
- SqlSever基础 union all 联合查询,简单的组合 两个查询结果拼在一起
镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...