①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. 解决ajax提交中文数据乱码

    function replaceWord(date,wordurl){                $.ajax({            url : 'wordReplace',          ...

  2. (转)mkpasswd 的使用

    原文:http://blog.csdn.net/u010339879/article/details/69788032 这个命令是随机生成 密码的一个工具, 如果没有这个命令,请安装相应的包. yum ...

  3. 牛客网Java刷题知识点之什么是进程、什么是线程、什么是多线程、多线程的好处和弊端、多线程的创建方式、JVM中的多线程解析、多线程运行图解

    不多说,直接上干货! 什么是进程? 正在进行中的程序(直译). 什么是线程? 就是进程中一个负责程序执行的控制单元(执行路径). 见 牛客网Java刷题知识点之进程和线程的区别 什么是多线程? 一个进 ...

  4. c#操作excel的一些记录

    //开启Excel APP            Excel.Application xlApp = new Excel.Application(); //获取程序下bin—>debug下的文件 ...

  5. Eureka与ZooKeeper 的比较

    Eureka的优势 1.在Eureka平台中,如果某台服务器宕机,Eureka不会有类似于ZooKeeper的选举leader的过程:客户端请求会自动切换到新的Eureka节点:当宕机的服务器重新恢复 ...

  6. 《C#多线程编程实现方式》

    一.使用线程的理由 1.可以使用线程将代码同其他代码隔离,提高应用程序的可靠性. 2.可以使用线程来简化编码. 3.可以使用线程来实现并发执行. 二.基本知识 1.进程与线程:进程作为操作系统执行程序 ...

  7. RESTful API设计基本原则

    REST四个基本原则:1.使用HTTP动词:GET POST PUT DELETE:2.无状态连接,服务器端不应保存过多上下文状态,即每个请求都是独立的:3.为每个资源设置URI:4.通过XML JS ...

  8. springboot项目搭建:结构和入门程序

    Spring Boot 推荐目录结构 代码层的结构 根目录:com.springboot 1.工程启动类(ApplicationServer.java)置于com.springboot.build包下 ...

  9. C#对bat脚本文件的操作示例

    实现C#操作bat脚本文件 using System;using System.Collections.Generic;using System.ComponentModel;using System ...

  10. DEEP LEARNING 大满贯课程表

    Reinforcement Learning post by ISH GIRWAN Courses/Tutorials Deep Reinforcement Learning, Spring 2017 ...