①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. regular expression, grep (python, linux)

    https://docs.python.org/2/library/re.html re.match(pattern, string, flags=0)  尝试从字符串的起始位置匹配一个模式 re.s ...

  2. CentOS 7 Linux 卸载/安装 Mariadb MySQL mysql 5.7

    [root@localhost mysql]# ls mysql-community-client--.el7.x86_64.rpm mysql-community-embedded-compat-- ...

  3. [OpenStack] [Liberty] Neutron单网卡桥接模式访问外网

    环境配置: * Exsi一台 * Exsi创建的单网卡虚拟机一台 * Ubuntu 14LTS 64位操作系统 * OpenStack Liberty版本 * 使用Neutron网络而非Nova网络 ...

  4. (转)shell解析命令行的过程以及eval命令

    shell解析命令行的过程以及eval命令   本文说明的是一条linux命令在执行时大致要经过哪些过程?以及这些过程的大致顺序. 1.1 shell解析命令行 shell读取和执行命令时的大致操作过 ...

  5. day06 - Python - 面向对象

    本节内容: 引子 面向对象 v.s. 面向过程 面向对象编程介绍 面向对象的特性:       封装       继承       多态 类.方法   1.引子 假设你现在是一家游戏公司的开发人员,现 ...

  6. Cloudera Manager卸载笔记

    1.通过管理平台分别停止组件服务和Cloudera Management Service 2.通过管理平台注销并移除Parcles (在控制台注销并移除,无论是安装的Parcles还是未安装的Parc ...

  7. 远程调用历史及代码编写demo

    历史介绍部分: 远程调用大致经过了corba.webservice.二进制跟restful四个阶段 corba时代,corba(Common Object Request Broker Archite ...

  8. mysql时间戳

    select unix_timestamp('2013-01-01 10:10:10'); , '%Y-%m-%d %H:%i:%S' ) date_format(date,'%Y-%m-%d') - ...

  9. js对象动态赋值

    <view class="movies-template"> <template is="movieListTemplate" data=&q ...

  10. C#中 计时器用法 运行时间

    有时候我们会需要计算某段代码运行的时间 比如一个sql查询,记录一段代码所花费的时间等等代码如下: System.Diagnostics.Stopwatch watch = new System.Di ...