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);

时间: 2024-08-29 04:30:06

JSON入门实例的相关文章

Android HttpGet() 请求简单入门实例

HttpClient httpclient = new DefaultHttpClient(); String url = "http://example.com"; List<NameValuePair> params = new ArrayList<NameValuePair>(); params.add( new BasicNameValuePair( "param", "value" ) ); URI uri =

jquery_ajax 入门实例

序:本文通过几个小例子,简介如何使用jqueryAjax异步加载. 1. $(selector).load(url,[data],[callback]) :载入远程HTML文件代码并插入DOM中. url (String) : 请求的HTML页的URL地址. data (Map) : (可选参数) 发送至服务器的 key/value 数据. callback (Callback) : (可选参数) 请求完成时(不需要是success的)的回调函数. 这个方法默认使用 GET 方式来传递的,如果[

Vue.js2.0从入门到放弃---入门实例

最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中,在网上也搜了很多教程,按着教程来做,也总会出现这样那样的问题(坑啊,由于网上那些教程都是Vue.js 1.x版本的,现在用Vue.js 的构建工具都已经升级到2.0版本了),经过了一段时间的摸索和看官方的教程和api,才了解到2.0版本在1.0版本的基础上做了好多调整,废弃了好多api...废话不多说了,把我踩过的坑,在这里跟大家说说,希望对初学者有所帮助.ps:高手请绕道. 既然是入门实例,那肯定从最基础的开始了,希

转-Vue.js2.0从入门到放弃---入门实例(一)

http://blog.csdn.net/u013182762/article/details/53021374 标签: Vue.jsVue.js 2.0Vue.js入门实例Vue.js 2.0教程 2016-11-03 14:40 21431人阅读 评论(9) 收藏 举报 版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[+] 最 近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中,在网上也搜了很多教程,按着教程来做,也总会出现这样那样的问题(坑啊, 由

SpringMVC详解(三)------基于注解的入门实例

前两篇博客我们讲解了基于XML 的入门实例,以及SpringMVC运行的详细流程.但是我们发现基于 XML 的配置还是比较麻烦的,而且,每个 Handler 类只能有一个方法,在实际开发中肯定是不可能这样来进行开发的.那么这篇博客我们就讲解实际开发中用的最多的基于注解配置的SpringMVC配置. 本篇博客源码下载 项目结构为: 1.在 web.xml 文件中配置前端处理器 <?xml version="1.0" encoding="UTF-8"?> &

Quartz入门实例13-spirng4和quartz2实现动态任务调用

pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> <model

nodejs入门实例(一)

nodejs入门实例(一) 一个简单的异步程序 var fs = require('fs'); //引用文件系统(fs)模块 fs.readFile('./json.json',function(err,data){ console.log(data); }) 一个Hello World Web服务器 1 server.listen(3000); 2 3 var http = require('http'); 4 5 var server = http.createServer(); 6 7 s

Spring MVC 入门实例

概述: springmvc 框架围绕DispatcherServlet这个核心展开,DispatcherServlet是Spring MVC的总控制,它负责截获请求并将其分派给相应的处理器处理.SpringMVC框架包括注解驱动控制器.请求及响应的信息处理.视图解析.本地化解析.上传文件解析.异常处理以及表单标签绑定等内容. SpringMVC是主要基于MODEL2实现的技术框架,Model2是经典的MVC(model.view.control)模型在web应用中的变体,这个改变主要源于HTTP

SpringMVC应用------基于注解的入门实例

SpringMVC应用------基于注解的入门实例 目录 1.在 web.xml 文件中配置前端处理器 2.在 springmvc.xml 文件中配置处理器映射器,处理器适配器,视图解析器 3.编写 Handler 4.编写 视图 index.jsp 5.在浏览器中输入:http://localhost:8080/SpringMVC-003/hello 前两篇博客我们讲解了基于XML 的入门实例,以及SpringMVC运行的详细流程.但是我们发现基于 XML 的配置还是比较麻烦的,而且,每个