JSON学习笔记之一
2010-09-14 13:44:03 来源：WEB开发网用于显示记录的JSP页面如下所示：
<%@ page language="java" import="java.util.*,model.xgb.vo.*" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!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>Get Permissions</title>
<script type="text/javascript" src="js/shirdrnPermission.js"></script>
</head>
<body onLoad="pageLoad();">
<div id="list"></div>
</body>
</html>
我通过使用onLoad事件，加载页面的时候，调用pageLoad()函数，该函数在js/shirdrnPermission.js中实现了，其中js/shirdrnPermission.js的实现如下所示：
var xmlHttp = null;
function pageLoad() {
document.body.style.color = "yellow";
showPermissions();
}
function createXMLHttp() {
if (typeof XMLHttpRequest != "undefined") {
return new XMLHttpRequest();
} else {
if (window.ActiveXObject) {
var aVersions = ["MSXML2.XMLHttp.5.0", "MSXML2.XMLHttp.4.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp", "Microsoft.XMLHttp"];
for (var i = 0; i < aVersions.length; i++) {
try {
return new ActiveXObject(aVersions[i]);
}
catch (e) {
alert("error");
}
}
}
}
}
var permissionArray;
var html = null;
function showPermissions() {
html = "<table bgcolor='green' border='1' width='100%'>"
+ "<tr>"
+ "<th>权限ID</th>"
+ "<th>学期</th>"
+ "<th>起始时间</th>"
+ "<th>截止时间</th>"
+ "<th>组织ID</th>"
+ "<th>操作ID</th>"
+ "<th>操作名称</th>"
+ "<th>角色ID</th>"
+ "</tr>";
if(xmlHttp == null) {
xmlHttp = createXMLHttp();
}
var url = "&semester=" + "2008-2009学年第一学期"
+ "&orgId=" + 1;
xmlHttp.open("GET","getPermissions.servlet?" + encodeURI(encodeURI(url)),true); // GetPermissions在web.xml中配置为<url-pattern>/getPermissions.servlet</url-pattern>
xmlHttp.onreadystatechange = function() {
if(xmlHttp.readyState == 4 && xmlHttp.status == 200) {
permissionArray = eval("(" + xmlHttp.responseText + ")"); // 将从服务器请求得到的JSON串转换为JavaScript的数组(这里是对象数组)
for(var i=0;i<permissionArray.length;i++) {
html += "<tr>";
html += "<td>" + permissionArray[i].id +"</td>";
html += "<td>" + permissionArray[i].semester +"</td>";
html += "<td>" + permissionArray[i].startTime +"</td>";
html += "<td>" + permissionArray[i].endTime +"</td>";
html += "<td>" + permissionArray[i].orgId +"</td>";
html += "<td>" + permissionArray[i].operatorId +"</td>";
html += "<td>" + permissionArray[i].operatorName +"</td>";
html += "<td>" + permissionArray[i].roleId +"</td>";
html += "</tr>";
}
html += "</table>";
var listContainer = document.getElementById("list");
listContainer.innerHTML = html;
}
}
xmlHttp.send(null);
}
启动WEB服务器，访问链接http://www.5a520.cn :8080/xgb/listPermissions.jsp可以看到页面显示的结果
使用JSON进行数据传送，比之于XML自然有很大的优势，至少JSON更加精简，将无关紧要的数据尽量压缩，所以速度比XML要快。
另外，JSON上面的这种使用方式就是使用JavaScript中的eval()函数来实现数据到类型的转换，使用JavaScript的数组或者对象就能遍历数据，而XML还要在JavaScript中使用XML DOM操作。
中查找“JSON学习笔记之一”更多相关内容
中查找“JSON学习笔记之一”更多相关内容更多精彩
赞助商链接
