①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. tomcat异常[1]--java.lang.ClassNotFoundException: XXXX.EncodingFilter

    EncodingFilter类在java项目中,确实存在,但是启动项目时,总是说找不到这个类. 后来想了一下,项目运行取的应该是项目WEB-INF/classes下面已经编译为.class文件的类文件 ...

  2. java源文件组成部分

    class HelloWorld{ public static void main(String[ ] args) { System.out.print("HelloWorld!!!&quo ...

  3. C++中遇到的各种小问题

    lpcwstr类型问题 在使用VS2010开发C++程序时,由于系统默认字符集是unicode字符集,造成与早期的字符串格式不兼容问题 ①Properties — Configuration Prop ...

  4. [转]使用jquery dataTable

    本文转自:http://blog.csdn.net/llhwin2010/article/details/8663753 jQuery 的插件 dataTables 是一个优秀的表格插件,提供了针对表 ...

  5. java.lang.IllegalArgumentException: Page directive: invalid value for import 问题处理

    1.问题说明: 项目原来用的tomcat版本是apache-tomcat-6.0,后来为了安全原因将版本升至apache-tomcat-7.0,发现有的jsp页面出现下面的异常: java.lang. ...

  6. 【转载】CSS3 常用四个动画(旋转、放大、旋转放大、移动)

    http://blog.csdn.net/fungleo/article/details/49848905

  7. 使用js调用摄像头拍照

    在一些浏览器里已经可以使用web api调用摄像头功能了. 基于此可以经行拍照摄像功能,网上找了些资料,然后实现了简单的拍照功能 演示地址 bingxl.cn/webrtc.html 代码 <! ...

  8. nopCommerce 3.9 中文语言包

    点击下载:nopCommerce 3.9 中文语言包 nopCommerce39语言包.xml 下载后解压通过后台导入即可使用.如何导入?点击这里

  9. Linux 作业调度器 crond

    linux缺省会启动crond进程,crond进程不需要用户启动.关闭.  需要启动/关闭cron /sbin/service crond start --启动服务 /sbin/service cro ...

  10. <Android 基础(十五)> Alert Dialog

    介绍 The AlertDialog class allows you to build a variety of dialog designs and is often the only dialo ...