jq:get获取json数据并以表格形式生成到页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jq-get方法</title>
<script type="text/javascript" src="../jquery-2.1.3.min.js"></script>
<script type="text/javascript">
$(function(){
$("input").click(function(){
$.get("test.json",function(data){
var data=data;
var str="<table border=1 width=100%>";
str+="<tr>";
for(var n in data[0]){
str+="<th>"+n+"</th>";
}
str+="</tr>";
for(var i=0;i<data.length;i++){
str+="<tr>";
for(var n in data[i]){
str+="<td align='center'>"+data[i][n]+"</td>";
}
str+="</tr>";
}
str+="</table>";
$("div").html(str);
})
})
})
</script>
</head>
<body>
<input type="button" value="向服务器发出异步请求" />
<div></div>
</body>
</html>
test.json文件：
[
{
"name": "艳艳",
"pass": "123456",
"age": "26"
},
{
"name": "张三",
"pass": "88888888",
"age": "28"
},
{
"name": "李四",
"pass": "111111",
"age": "29"
}
]
