个人java学习路线-JSON

介绍

JSON:JavaScript Object Notation(数据交换格式)
   标准的轻量级的数据交换格式
   体积小,易解析
   实际开发中最多用的是JSON和XML
   但XML:体积大,解析麻烦,语法严谨(通常银行相关的系统)

初见

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>1</title>
	</head>
	<body>
		<script type="text/javascript">
			//创建JSON对象(也可以称为无类型对象)
			var studentObj={
				"sno":"110",
				"sname":"张三",
				"sex":"男"
			};
			
			alert(studentObj.sno+","+studentObj.sname+","+studentObj.sex)			
			var students=[{"sno":"110","sname":"张三","sex":"男"},
			{"sno":"120","sname":"李四","sex":"男"},
			{"sno":"130","sname":"王五","sex":"男"}];
			for (var i = 0; i < students.length; i++) {
				alert(students[i].sno+","+students[i].sname+","+students[i].sex);
			}			
		</script>
	</body>
</html>

JSON对象属性也可以像数组一样一层套一层

<script type="text/javascript">
var user={
	"usercode":110,
	"username":"张三",
	"sex":true,
	"address":{
		"city":"洛斯里克",
		"street":"步行街",
		"zipcode":"1221"
	},
	"hobby":["吃","喝","睡"]
};
alert(user.address.city);	
</script>

eval函数将普通字符串转换为js代码

<script type="text/javascript">
/* 
		将字符串当成一段JS代码解释并执行
	 */		
	window.eval("var i=100");
	//alert("i="+i);			
	var fromJava="{\"name\":\"zhangsan\",\"password\":\"123\"}";
	window.eval("var jsonObj="+fromJava);
	alert(jsonObj.name+","+jsonObj.password);
	/* 
	 在js中:
	 []是数组
	 {}是JSON
	 */		
	var json={
		"username":"zhangsan"
	}
	alert(json.username);
	alert(json["username"]);
	
	/* for (var propertyName in json) {
		
	} */
</script>

用例:用JSON显示列表信息

<body>
<script type="text/javascript">
		var data={
			"total":4,
			"emps":[
				{"empno":7369,"ename":"SMITH","sal":800.0},
				{"empno":7380,"ename":"TOM","sal":1000.0},
				{"empno":7404,"ename":"YONTH","sal":1200.0},
				{"empno":7502,"ename":"LIADA","sal":1800.0},
			]
		}		
		window.onload=function(){
			var btnElt=document.getElementById("btn");
			btnElt.onclick=function(){
				var emps=data.emps;
				var html="";
				for (var i = 0; i < emps.length; i++) {
					var emp=emps[i];
					html +="<tr>";
					html +="<td>"+emp.empno+"</td>";
					html +="<td>"+emp.ename+"</td>";
					html +="<td>"+emp.sal+"</td>";
					html +="</tr>";
				}
				document.getElementById("emptbody").innerHTML=html;
				document.getElementById("sp").innerText=data.total;
			}
		}
	</script>
	<h2>员工信息列表</h2>
	<input type="button" id="btn" value="显示员工信息列表" />
	<hr />
	<table border="1px" width="50%">
		<tr>
			<th>员工编号</th>
			<th>员工名字</th>
			<th>员工薪资</th>
		</tr> 
		<tbody id="emptbody">
		</tbody>
	</table>
	总共<span id="sp">
		0
	</span>条记录
</body>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值