微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

json字符串转table

JSON是一种轻量级的数据交换格式,它已成为现代Web开发中的常用数据格式。当我们从服务器获取一个JSON字符串时,我们有时需要将它转换成Table格式,以便我们更直观的展示数据。


//假设我们从服务器请求到的JSON字符串如下:
var jsonString = '[{"name":"张三","age":20,"gender":"男"},{"name":"李四","age":25,"gender":"女"},{"name":"王五","age":30,"gender":"男"}]';

var jsonArr = JSON.parse(jsonString);  //将JSON字符串转换为JavaScript对象

var table = <table>;  //创建一个table元素

//创建表头
var thead = <thead>;
var tr = <tr>;
for(var key in jsonArr[0]){
    var th = <th>;
    th.innerHTML = key;
    tr.appendChild(th);
}
thead.appendChild(tr);
table.appendChild(thead);

//创建表格内容
var tbody = <tbody>;
for(var i = 0; i < jsonArr.length; i++){
    var tr = <tr>;
    for(var key in jsonArr[i]){
        var td = <td>;
        td.innerHTML = jsonArr[i][key];
        tr.appendChild(td);
    }
    tbody.appendChild(tr);
}
table.appendChild(tbody);

document.body.appendChild(table);  //将table元素添加页面

json字符串转table

以上代码将从服务器获取到的JSON字符串转换成了表格格式,让数据更易于阅读和理解。当然,以上代码仅为一个简单的示例,实际开发中我们可能需要根据具体的需求进行不同的展示方式和样式设计。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐