<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

  <script type="text/javascript" src="../js/jquery-1.7.2.js"></script>

  <script type="text/javascript" src="json2.js"></script>

    <title>jsonTest.html</title>

	<script type="text/javascript">

		function testJson(){

			var jsonTest='{"name":"aaa","age":12}';				//定义一个简单的字符串类型

			var jsonObj=JSON.parse(jsonTest);					//转换为json对象

			$("#div1").html("年龄"+jsonObj.name);				//读取并输出json元素

			var jsonTests='[{"name":"aaa","age":12},{"name":"bbb","age":25},{"name":"ccc","age":35},{"name":"ddd","age":45}]'			//定义一个json数组对象的字符串

			var jsonObjs=JSON.parse(jsonTests);			//转换为json数组对象

			for ( var i = 0; i < jsonObjs.length; i++) {

					$("#div2").html($("#div2").html()+"<br/>"+"名字"+jsonObjs[i].name+"年龄"+jsonObjs[i].age);				//读取json数组中的所有json对象以及json对象的元素

			}

			var jsonTestss={"yuangong":[{"name":"aaa","age":12},{"name":"bbb","age":25},{"name":"ccc","age":35},{"name":"ddd","age":45}],		

				"xuesheng":[{"name":"xuesheng1","age":22},{"name":"xuesheng2","age":20}]				//定义一个组合类型的json对象

			};

			$("#div3").html(jsonTestss.yuangong.length+"<br>");

			for ( var i = 0; i < jsonTestss.yuangong.length; i++) {

					$("#div3").html($("#div3").html()+"<br/>"+"名字"+jsonTestss.yuangong[i].name+"年龄"+jsonTestss.yuangong[i].age);

					}

		}

	</script>

  </head>

  <body onload="testJson()">

 		<div id="div1"></div>

 		<div id="div2"></div>

 		<div id="div3"></div>

  </body>

</html>

　　

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <title>jQueryJson.html</title>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

   <script type="text/javascript" src="../js/jquery-1.7.2.js"></script>

    <script type="text/javascript">

    $(function(){

    	var jsons='[{"name":"aaa","age":12},{"name":"bbb","age":25},{"name":"ccc","age":35},{"name":"ddd","age":45}]'		//定义一个json数组对象

    	var jsonObj=eval(jsons);

    	for ( var i = 0; i < jsonObj.length; i++) {

			$("#div1").html($("#div1").html()+"<br/>"+"姓名"+jsonObj[i].name+"年龄"+jsonObj[i].age);

		}

			$.each(jsonObj,function(i){

				$("#div1").html($("#div1").html()+"<br/>"+"姓名"+jsonObj[i].name+"年龄"+jsonObj[i].age);

			})

			$.each(jsonObj,function(i,n){

				$("#div1").html($("#div1").html()+"<br/>"+"下标为"+i+"的人的姓名"+n.name+"年龄"+n.age);

			})

    });

    </script>

  </head>

  <body>

  <div id="div1"></div>

  </body>

</html>

　　

简单的Json数据的更多相关文章

  1. java后台设计简单的json数据接口，设置可跨域访问，前端ajax获取json数据

    在开发的过程中,有时候我们需要设计一个数据接口.有时候呢,数据接口和Web服务器又不在一起,所以就有跨域访问的问题. 第一步:简单的设计一个数据接口. 数据接口,听起来高大上,其实呢就是一个简单的Se ...

  2. iOS开发-简单解析JSON数据

    什么是JSON   JSON是一种轻量级的数据格式,一般用于数据交互 服务器返回给客户端的数据,一般都是JSON格式或者XML格式(文件下载除外) JSON的格式很像OC中的字典和数组   {“nam ...

  3. （1-1）入门—最简单的树（使用json数据）

    1.<!DOCTYPE html>是必须的. 2.zTree 的容器 className 别忘了设置为 "ztree". 使用ztree创建树,首先要引用ztree相关 ...

  4. Gson解析复杂的json数据

    最近在给公司做一个直播APK的项目,主要就是通过解析网络服务器上的json数据,然后将频道地址下载下来再调用Android的播放器进行播放,原先本来打算使用普通的json解析方法即JsonObject ...

  5. Android 学习笔记之Volley(七)实现Json数据加载和解析...

    学习内容: 1.使用Volley实现异步加载Json数据...   Volley的第二大请求就是通过发送请求异步实现Json数据信息的加载,加载Json数据有两种方式,一种是通过获取Json对象,然后 ...

  6. 使用Gson解析复杂的json数据

    Gson解析复杂的json数据 最近在给公司做一个直播APK的项目,主要就是通过解析网络服务器上的json数据,然后将频道地址下载下来再调用Android的播放器进行播放,原先本来打算使用普通的jso ...

  7. servlet 返回json 数据

    后端的数据需要返回简单的json数据: 发现通过双引号和单引号:" {  'name':123 }  "的方式返回失败. 需要通过\转义里边的双引号: response.getWr ...

  8. Jackson 解析json数据之忽略解析字段注解@JsonIgnoreProperties

    转自:http://blog.csdn.net/ngl272/article/details/70217104 以前解析json用的惯的就是Google的gson了,用惯了基本就用它了,一直也没发现什 ...

  9. 通过Gson解析Json数据

    Json是一种数据格式,便于数据传输.存储.交换:Gson是一种组件库,可以把java对象数据转换成json数据格式. gson.jar的下载地址:http://search.maven.org/#s ...

随机推荐

  1. Service的绑定过程

    --摘自<Android进阶解密> 第一步:ContextImpl到AMS的调用过程 第二步:Service的绑定过程 1)几个与Service相关的对象类型 * ServiceRecor ...

  2. 基于Anaconda安装tensorflow-GPU和caffe-GPU

    1.创建虚拟环境 我们先创建一个用于caffe和tensorflow共存的虚拟环境,安装完成后激活环境. conda create -n caffe_tf_36 python=3.6 source a ...

  3. eclipse导入新项目配置jdk、tomcat到浏览器正常访问

    好记性不如烂笔头,长时间不操作就会生疏,在此做个笔记 1.导入项目 2,进入选择项目,点finish完成,导入成功 3.配置tomcat和jdk 选择本地相对应jdk的jre 选择tomcat版本进行 ...

  4. [jzoj]3456.【NOIP2013模拟联考3】恭介的法则(rule)

    Link https://jzoj.net/senior/#main/show/3456 Description 终于,在众亲们的奋斗下,最终boss 恭介被关进了库特设计的密室.正当她们松了一口气时 ...

  5. PrintService类打印

    系统打印服务框架代码位于android.printservice包中.系统并没有实现具体打印功能,需要打印机厂商制作插件接入系统打印服务之后,自行实现 主要类: PrintDocument:表示待打印 ...

  6. servlet实现简单的登录功能

    1.登录页面 Login.html <%@page contentType="text/html" pageEncoding="UTF-8"%> & ...

  7. laravel整合vue 多入口解决

    2018年8月10日23:10:29 其实整合是挺简单,因为laravel本身就准备的挺好了 laravel 版本5.6   注意php cli是web是不一样的 这个需要设置环境变量 ,php需要7 ...

  8. A股魔咒

    4.19魔咒 从2007年开始每逢4月19日大盘大跌. 基金“88”魔咒 88%魔咒,就是当基金的仓位水平达到88%左右的时候,A股市场往往会出现大跌,基金仓位成了股市的“反向指标”,当基金的平均仓位 ...

  9. jQuery实现select级联

    使用Html5的数据属性(data-*)Map级联关系,代码如下: <!DOCTYPE html> <html> <head> <title>Selec ...

  10. linux中MTDflash设备驱动大概

    一.主要结构体 1.mtd_info,主要是描述MTD原始设备层中的设备或分区, 2.mtd_part,表示一个分区,用里面的主mtd_info和本分区mtd_info描述分区, 3.mtd_part ...