json案例,使用json,使用eval和parse

直接看图看代码!


testJSON2.jsp页面

<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
	<%
	String myMessage = "{name:\"杨过\",age:\"19\",sayHello:function(){alert(\"hello,我是杨过\");}}";
	request.setAttribute("message", myMessage);
	String myMessage2 = "{name:'韦小宝',age:'14',sayHello:function(){alert('hello,我是韦小宝');}}";
	request.setAttribute("message2", myMessage2);
	String myMessage3 = "{name:'段誉',age:'22',hobby:['电影','音乐','阅读'],sayHello:function(){alert('hello,我是段誉');}}";
	request.setAttribute("message3", myMessage3);
	%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>解析json</title>
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/body.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/mark.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/input2.css">
</head>
<body>
	<center>
		<h2>解析Json</h2>
		用户名:<input type="text" id="userName"><br><br>
		密码:<input type="text" id="age"><br><br>
		爱好:<input type="text" id="hobby"><br><br>
		<div class="testDiv3" id="showText">
		</div><br>
		<input type="button" value="解析Json数据" οnclick="analyzeJsonData()">
		<input type="button" value="解析Json数据2" οnclick="analyzeJsonData2()">
		<input type="button" value="解析Json数据3" οnclick="analyzeJsonData3()">
		<input type="button" value="清空" οnclick="cleanTextDiv()">
	</center>
</body>
<script type="text/javascript">
var testJson = '{name:"令狐冲",age:"17",sayHi:function(){alert("hello,我是令狐冲,我今年" + this.age + "岁了!");}}';
//测试下属性值有{}花括号字符能不能正确解析
var testJson2 = '{name:"囧{}囧",age:"6",hobby:["电{影","音}乐","阅{}读"]}';
var testJson3 = {name:"张无忌",age:"18",hobby:["电{影","音}乐","阅{}读"],sayHello:function(){alert("hello,我是张无忌,我今年" + this.age + "岁了!" + "我的爱好是" + this.hobby);}};
var testJson4 = '${requestScope.message}';
var testJson5 = "${requestScope.message2}";
var testJson6 = ${requestScope.message3};

alert(testJson);
alert(testJson3);
alert(testJson4);

//解析Json
function analyzeJsonData(){
	//调用testJson3对象的sayHello()方法
	testJson3.sayHello();
	alert("测试");
	var obj = eval("(" + testJson + ")");
	//调用obj对象的sayHi()方法
	obj.sayHi();
	document.getElementById("userName").value = obj.name;
	document.getElementById("age").value = obj.age;
	var obj2 = eval("(" + testJson2 + ")");
	//var obj2 = eval((testJson2));
	//var obj2 = eval(testJson2);
	document.getElementById("userName").value = obj2.name;
	document.getElementById("age").value = obj2.age;
	document.getElementById("hobby").value = obj2.hobby;
	
	var showTextDivNode = document.getElementById("showText");
	var obj3 = eval(testJson3);
	showTextDivNode.innerHTML += "testJson3=" + obj3.name + " / " + obj3.age + "<br>";
	showTextDivNode.innerHTML += "testJson3=" + testJson3.name + " / ";
	showTextDivNode.innerHTML += testJson3.age + "<br>";
	var obj4 = eval('(' + testJson4 + ')');
	showTextDivNode.innerHTML += "testJson4=" + obj4.name  + " / " + testJson4.name + "<br>";
	var obj5 = eval("(" + testJson5 + ")");
	showTextDivNode.innerHTML += "testJson5=" + obj5.name  + " / " + testJson5.name + "<br>";
	var obj6 = eval(testJson6);
	showTextDivNode.innerHTML += "testJson6=" + obj6.name + " / " + obj6.hobby + " / " + testJson6.name + " / " + testJson6.hobby + "<br>";
	testJson3.sayHello();
}

//解析Json
function analyzeJsonData2(){
	var showTextDivNode = document.getElementById("showText");
	var jsonStr = '{RecordCount:"108",RecordList:[{BALANCE:"69825.92",JFYE:"98562.89"}]}';
	var jsonObj = eval("(" + jsonStr + ")");
	//alert(jsonObj.RecordList.length);
	//alert(jsonObj.RecordList[0].BALANCE);
	//alert(jsonObj.RecordList[0].JFYE);
	showTextDivNode.innerHTML += jsonObj.RecordCount + " / " + jsonObj.RecordList.length + " / " + jsonObj.RecordList[0].BALANCE + " / " + jsonObj.RecordList[0].JFYE + "<br>";
	var jsonStr2 = {RecordCount:"668",RecordList:[{BALANCE:"827.98",JFYE:"996.21"}]};
	var jsonObj2 = eval(jsonStr2);
	//alert(jsonObj2.RecordList.length);
	//alert(jsonObj2.RecordList[0].BALANCE);
	//alert(jsonObj2.RecordList[0].JFYE);
	showTextDivNode.innerHTML += jsonStr2.RecordCount + " / " + jsonStr2.RecordList.length + " / " + jsonObj2.RecordList[0].BALANCE + " / " + jsonObj2.RecordList[0].JFYE + "<br>";
}
//解析Json
function analyzeJsonData3(){
	var showTextDivNode = document.getElementById("showText");
	var onlineNames = ['华山派令狐冲','丐帮乔峰','段誉','韦小宝','明教张无忌','杨过'];
	var citys = ["江西省于都县","江西省赣县","江西省兴国县","江西省赣州市",'江西省南昌市','江西省南康市'];
	showTextDivNode.innerHTML += citys.length + " / " + citys[0] + "<br>"
	showTextDivNode.innerHTML += onlineNames.length + " / " + onlineNames[0] + "<br>"
	var citysObj = eval(citys);
	showTextDivNode.innerHTML += citysObj.length + " / " + citysObj[0] + "<br>"
	var jsonStr = {name:'囧囧',age:5};
	showTextDivNode.innerHTML += jsonStr.name + " / " + jsonStr.age + "<br>";
	var jsonObj =  eval(jsonStr);
	showTextDivNode.innerHTML += jsonObj.name + " / " + jsonObj.age + "<br>";
	var jsonObj2 =  eval("(" + jsonStr + ")");
	showTextDivNode.innerHTML += jsonObj2.name + " / " + jsonObj2.age + "<br>";
	
}

//清空层里面的内容
function cleanTextDiv(){
	document.getElementById("showText").innerHTML = "";
}

</script>
</html>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值