html解析json数据为表格table显示

阳光穿透心脏的1/2处 2022-06-03 00:55 644阅读 0赞

<!DOCTYPE html>
    <html>
    <head>
    	<title></title>
    </head>
    <body>
    <table id="table" border="1" cellspacing="0" cellpadding="0" >
       <tr>
            <th>BrandName</th>
            <th>Modul</th>
            <th>Quantity</th>
            <th>Datecode</th>
            <th>Remark</th>
        </tr>
    </table>
    <script>
    window.οnlοad=function(){
    var data=[{"BrandName":"ACES","Modul":"91906-0227P","Quantity":"3057","Datecode":"W2Y","Remark":"stock"},
    {"BrandName":"ADI","Modul":"ADM706TARZ-REEL","Quantity":"2145","Datecode":"W2Y","Remark":"stock"},
    {"BrandName":"ADI","Modul":"ADR02AUJZ-REEL7","Quantity":"2131","Datecode":"W2Y","Remark":"stock"}];
    
        
        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].BrandName;
                                var c2=row.insertCell(1);
                                c2.innerHTML=data[i].Modul;
                                var c3=row.insertCell(2);
                                c3.innerHTML=data[i].Quantity;
                                var c4=row.insertCell(3);
                                c4.innerHTML=data[i].Datecode;
                                var c5=row.insertCell(4);
                                c5.innerHTML=data[i].Remark;
                            }
    }
    </script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，644人围观）

还没有评论，来说两句吧...

相关阅读

相关 HTML表格（table）实例

> 实例1：课程表 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT

刺骨的言语ヽ痛彻心扉/ 2023年10月17日 22:56/ 0 赞/ 88 阅读

相关 HTML table表格详解

一、表格属性 <table style="width:500px;"> <tbody> <tr> <td style="text-align:cente

本是古典何须时尚/ 2023年10月12日 10:29/ 0 赞/ 58 阅读

相关 html画table表格

代码： <!DOCTYPE> <html> <head> <meta charset="utf-8"> <styl

小咪咪/ 2023年10月03日 19:14/ 0 赞/ 19 阅读

相关 layui数据表格如何获取id_layui表格table怎么引入json读取表格数据显示？

展开全部 ![Image 1][] 如上图所示，要32313133353236313431303231363533e58685e5aeb931333365636633扣除里

今天药忘吃喽~/ 2023年01月01日 06:51/ 0 赞/ 195 阅读

相关通过js将table表格数据下载为Excel表格

1.创建用于下载数据的excel\_create.jsp页面 <%@ page contentType="text/html; charset=utf-8" %>

约定不等于承诺〃/ 2022年07月15日 05:17/ 0 赞/ 507 阅读

相关 bootstrap 实现用 table 表格显示list数据

1. 后台如何获取list数据的就不详细解释了，传递到前台的方式，我用的是 model.addAttribute("categories",categories);

逃离我推掉我的手/ 2022年07月12日 10:25/ 0 赞/ 591 阅读

相关 html解析json数据为表格table显示

<!DOCTYPE html> <html> <head> <title></title> </head> <body>

阳光穿透心脏的1/2处/ 2022年06月03日 00:55/ 0 赞/ 645 阅读

相关 HTML表格table

什么是表格？表格是由行和列排列而成的一种结构，按照行和列呈现数据，从而进行页面布局。这种布局方式已经过时。建议使用div+css实现页面布局。如何创建HTML表格：H

淡淡的烟草味﹌/ 2022年05月15日 00:30/ 0 赞/ 399 阅读

相关 HTML table表格结构

表格基本上有如下几个标签构成: （1）.`<table>`标签用来创建表格的外部框架。（2）.`<tr>`标签用来创建表格的行。

小灰灰/ 2020年05月16日 20:11/ 0 赞/ 1009 阅读

相关 HTML <table>表格概述

使用`<table>`可以创建一个表格，之前，表格会用来进行页面布局，但是由于嵌套过于复杂，不利于灵活布局和后期改版，当前已经鲜有使用，不要认为它已经被淘汰，而是被用来...

小灰灰/ 2020年05月16日 20:07/ 0 赞/ 998 阅读