您的位置:首页 > Web前端 > JQuery

JQuery解析Json数据填充到表格

2018-01-12 16:12 1351 查看
步骤:

     1、获取json串

     2、通过json串,动态拼接html语句

     3、通过jquery获取table,然后往table中输出html


<script type="text/javascript">
function getList() {

$.ajax({
type : "GET",
url : "ajaxGet",
data : {
method : "query"
},
dataType : "json",//返回的数据类型

success : function(data) {

var html = '';
for ( var i = 0; i < data.length; i++) {//循环json对象,拼接tr,td的html
html = html + '<tr>';
html = html + '<td>' + data[i].id + '</td>';
html = html + '<td>' + data[i].username + '</td>';
html = html + '<td>' + data[i].password + '</td>';
html = html + '<td>' + data[i].power + '</td>';
html = html + '<td>' + data[i].name + '</td>';
html = html + '<td>' + data[i].time + '</td>';
html = html + '</tr>';
}
$('#tr').html(html);//通过jquery方式获取table,并把tr,td的html输出到table中
},
error : function() {
alert("查询失败!");
}
});
}
</script>
<table class="table" id="tr" style="text-align: center;">

</table>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: