①js循环读取json数据的方式:

var data=[{"uid":"2688","uname":"*江苏省南菁高级中学 022","sum":274.23},{"uid":"2689","uname":"*江阴国际会展中心管理有限公司 024","sum":0},{"uid":"2686","uname":"江苏申利实业股份有限公司 001","sum":7917.94},{"uid":"2715","uname":"江阴市吉达针纺有限公司 115","sum":41.39},{"uid":"2688","uname":"*江苏省南菁高级中学 022","sum":274.23}]
for(var i=0;i<data.length;i++){
alert(i);
alert(data[i]);
alert("id:"+data[0].uid+"name:"+data[0].uname);

②将读取到的数据用js写成表格:

html部分:

<table id="table">
<tr>
<th>uid</th>
<th>uname</th>
<th>sum</th>
</tr>
</table>

js部分:

window.onload=function(){
var data=[{"uid":"2688","uname":"*江苏省南菁高级中学 022","sum":274.23},{"uid":"2689","uname":"*江阴国际会展中心管理有限公司 024","sum":0},{"uid":"2686","uname":"江苏申利实业股份有限公司 001","sum":7917.94},{"uid":"2715","uname":"江阴市吉达针纺有限公司 115","sum":41.39},{"uid":"2688","uname":"*江苏省南菁高级中学 022","sum":274.23}]
/*for(var i=0;i<data.length;i++){
alert(i);
alert(data[i]);
alert("id:"+data[0].uid+"name:"+data[0].uname)
}*/js循环读取json数据
var table=document.getElementById("table");
for(var i=0;i<data.length;i++){
var row=table.insertRow(table.rows.length);
var c1=row.insertCell(0);
c1.innerHTML=data[i].uid;
var c2=row.insertCell(1);
c2.innerHTML=data[i].uname;
var c3=row.insertCell(2);
c3.innerHTML=data[i].sum;
}
}

运行结果:

表格样式可在css中自定义。

如有疑问,可留言!

js循环读取json数据,将读取到的数据用js写成表格的更多相关文章

  1. JS 循环遍历JSON数据 分类: JS技术 JS JQuery 2010-12-01 13:56 43646人阅读 评论(5) 收藏 举报 jsonc JSON数据如:{&quot;options&quot;:&quot;[{

    JS 循环遍历JSON数据 分类: JS技术 JS JQuery2010-12-01 13:56 43646人阅读 评论(5) 收藏 举报 jsonc JSON数据如:{"options&q ...

  2. JS 循环遍历JSON数据

    JSON数据如:{"options":"[{/"text/":/"王家湾/",/"value/":/" ...

  3. JS循环遍历JSON数据的方法

    JSON数据如:{"options":"[{/"text/":/"王家湾/",/"value/":/" ...

  4. js循环便利json数据

    var data=[{name:"a",age:12},{name:"b",age:11},{name:"c",age:13},{name: ...

  5. JS 循环遍历json

    第一  看看json的格式 { "employees": [ { "firstName":"Bill" , "lastName&q ...

  6. JS对象与json字符串格式

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  7. 浅谈JSON与与JS相关的JSON函数

    本文内容主要引用在微信公众号上看到的一片文章,因为自己对Json了解不是很深入,所以就整理出这篇博文与大家分享! 一. JSON是一种格式,基于文本,优于轻量,用于交换数据 1.一种数据格式 数据的传 ...

  8. Js循环读取JSON数据

    <script> $(function () { var jsonString = '{Unid:"1",CustomerName:"宋江",Age ...

  9. js读取json数据(php传值给js)

    <?php $array =array('fds','fdsa','fdsafasd');  // json_encode($array); ?> <html> <hea ...

随机推荐

  1. Murano为镜像包添加Root用户密码

    1. 安装dib-utils Dib Utils 是 diskimage-builder 工程的一部分,但是他们也用于 diskimage-builder 工程外部. 因为基于云的磁盘空间已经溢出,推 ...

  2. Murano Weekly Meeting 2015.09.15

    Meeting time: 2015.September.15th 1:00~2:00 Chairperson:  Serg Melikyan, PTL from Mirantis Meeting s ...

  3. zepto.js常用操作

    zepto.js是移动端的jquery,但是并没有提供所有与jquery类似的api.Zepto设计的目的是有一个5-10k的通用库.下载并快速执行.有一个熟悉通用的API,所以你能把你主要的精力放到 ...

  4. IIS/asp.net管道

    http://referencesource.microsoft.com/ 理解ASP.NET的前提是对ASP.NET管道式设计的深刻认识.而ASP.NET Web应用大都是寄宿于IIS上的. IIS ...

  5. Spring boot-(3) Spring Boot特性2

    1. 外部配置 Spring Boot支持外部配置,以便可以在不同的环境中使用相同的应用程序代码.可以使用properties文件,YAML文件,环境变量或命令行参数进行外部配置.可以使用@Value ...

  6. 解决在 WP8/ WP8.1 项目中 引用 C++ 组件时出现的 System.TypeLoadException 错误

    本文为个人博客备份文章,原文地址: http://validvoid.net/wp-cpp-typeloadexception/ 使用 Visual Studio 2013 update 4 在 WP ...

  7. tomcat多站点部署

    我们可能会有这种场景,一个tomcat想部署两个web工程,说白了就是公用一个端口,那怎么办呢?就是多站点部署,具体步骤如下(这里以linux平台举例): 1)先修改server.xml(conf/s ...

  8. Cg shadow of sphere

    参考自:https://en.wikibooks.org/wiki/GLSL_Programming/Unity/Soft_Shadows_of_Spheres using UnityEngine; ...

  9. Mautic-2.2.0 (Ubuntu 16.04)

    平台: Ubuntu 类型: 虚拟机镜像 软件包: mautic-2.2.0 business intelligence commercial ecommerce mautic open-source ...

  10. 变更hostname

    具有dns解析的主机名 # vim /etc/sysconfig/network ... HOSTNAME=webserver.mydomain.com ... # hostname webserve ...