本文介绍了用来自JavaScript数组的数据创建HTML表的最快方法是什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有以下代码将JSON数据集转换为html表.我想知道这是否是最快的方法,还是应该将jqote2与jquery一起使用来编写模板?

I have the following code to convert my JSON dataset to html table.I want to know if it is the fastest method, or should I use jqote2 with jquery to write template?

  • 单击即可更改col定义(客户端可以更改查看表的方式,col定义数组将更改,并且表可以重建)
  • 排序,过滤和分析分页(我相信可以对原始数据进行排序并可以重建表)
  • 转换(如果说1个col包含以不同单位表示长度的数据,则可以在原始数据集中添加一个具有1个相同单位的数据的新col以便可以对数据进行排序)

因此,如果我步入正轨或正在研究已经存在的东西,有人可以指导我吗?

So can somebody guide me if I am on right track or am I working on something that already exists?

<div id="hii"><!-- table loads here --></div>

<script>
var set1={ // JSON dataset & col definitions
    'col':[ // definition/template of data to load in column cells
        [function(x){return '<a href="?sid='+x[1]+'">'+x[0]+'</a>';}],
        [function(x){return '<a href="?id='+x[2]+'">'+x[2]+'</a>';}],
    ],
    'data':[ // raw data, output table has only 2cells/row using these 3 values from each row
        ['Name 1','00000001','Value 1'],
        ['Name 2','00000002','Value 2'],
        ['Name 3','00000003','Value 3'],
        ['Name 4','00000004','Value 4'],
        ['Name 1','00000001','Value 5'],
        ['Name 5','00000005','Value 1'],
        ['Name 6','00000006','Value 1'],
        ['Name 7','00000007','Value 2'],
        ['Name 8','00000008','Value 6'],
        ['Name 9','00000009','Value 3'],
        ['Name A','00000010','Value 7'],
        ['Name B','00000011','Value 7'],
        ['Name C','00000012','Value 1'],
    ],
};
function tbody(x){ // function to create table, using dataset name passed to x
    for(i=0,data='';i<x.data.length;i++){
        data+='<tr>';
        for(j=0;j<x.col.length;j++){
            data+='<td>'+x.col[j][0](x.data[i])+'</td>';
        }
        data+='</tr>';
    }
    return data;
}
document.getElementById('hii').innerHTML='<table>'+tbody(set1)+'</table>';
</script>

推荐答案

您可以使用数据表.它可以与jQuery一起使用,并且也可以使用.您可以设置很多选项来满足您的要求,甚至更多.

You can use Datatables. It works with jQuery and is also themable. There are quite a few options you can set that can meet your requirements, and even more.

这篇关于用来自JavaScript数组的数据创建HTML表的最快方法是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-16 07:18