Javascript 在html中创建没有硬代码的表

我想创建一个十行五列的表，其中只填充了两行，并且每行的第一个单元格都有一个复选框。我想用jquery脚本编写整个表代码，但不想在html页面中将其定义为硬代码数据。我希望它作为一个数组，而不是每行的单个变量

$(document).ready(function() {
var table = [

{ 
  check: '<label><input type="checkbox" class="case" /><span></span>
  </label>',
  name: 'XYZ',
  score: '<div class="score">34</div>',
},
{ 
  check: '<label><input type="checkbox" class="case" /><span></span>
  </label>',
  name: 'XYZ',
  score: '<div class="score">34</div>',
},
{ 
  check: '<label><input type="checkbox" class="case" /><span></span>
  </label>',
  name: 'XYZ',
  score: '<div class="score">34</div>',
},

 $.each(table, function(index, obj)
 {
var row = '<tr>';
row += '<td>' + obj.check + '</td>';
row += '<td>' + obj.name + '</td>';
row += '<td>' + obj.score + '</td>';
row += '<td>' + obj.mail + '</td>';
row += '<td>' + obj.other + '</td>';
$('tbody').append(row);
});

$（文档）.ready（函数（）{
变量表=[
{ 
支票：'
',
名称：“XYZ”，
得分：34分，
},
{ 
支票：'
',
名称：“XYZ”，
得分：34分，
},
{ 
支票：'
',
名称：“XYZ”，
得分：34分，
},
$。每个（表、函数（索引、obj）
{
var行=“”；
行+=''+对象检查+''；
行+=''+obj.name+''；
行+=''+目标分数+''；
行+=''+obj.mail+''；
行+=''+对象其他+''；
$（'tbody'）。追加（行）；
});

---

我不想每次都声明对象。我想使用一个数组来定义“name、score、mail、other”，然后将相关项推送到该数组变量中

  $.each(table, function(index, obj)
     {
       var row = '<tr>';
       var keys = Object.keys(obj);
       $.each(keys, function(index, val){
         row += '<td>' + obj[val] + '</td>';
      });
      row += '</tr>';
      $('tbody').append(row);
    });

$。每个（表、函数（索引、obj）
{
var行=“”；
var keys=Object.keys（obj）；
$。每个（键、函数（索引、val）{
行+=''+obj[val]+''；
});
行+=''；
$（'tbody'）。追加（行）；
});

---

在这里，您可以看到如何迭代对象以获取所有键值，这样您就不需要显式地编写obj.name、obj.type等。

如果我理解正确，这将提供您所需的内容。所有内容，包括列、标题和内容、要呈现的行数以及要显示的数据，都是通过数组配置的没有硬编码的HTML，它可以通过JavaScript进行操作

我希望这是有用的

$（文档）.ready（函数（）{
//列及其基本内容的预定义数组
var cols={
“Check”：$（“”，{“type”：“checkbox”，“class”：“case”}），
“名称”：$（“”，{html:”“}），
“分数”：$（“”，{“类”：“分数”}），
“邮件”：$（“”，{html:'}），
“其他”：$（“”，{html:”“}）
};
var trows=10；//要渲染的行总数
var数据=
[
{“姓名”：“ABC”，“分数”：34，“邮件”：“xyz”，“其他”：“布拉赫”}，
{“姓名”：“DEF”，“分数”：43，“邮件”：“iii”，“其他”：“fff”}
];
对于（变量i=0；i

表格{
边界塌陷：塌陷；
}
表td，表th{border:solid 1px#cccc；padding:10px；}

请阅读以下内容：并向我们展示您到目前为止的成果。分享您尝试的代码此“问题”不包含问题。这只是一个愿望列表。你研究了什么？你尝试了什么？你坚持什么？这不是一个免费的“编写我的代码”服务，它是一个为你已经编写的代码进行故障排除的网站。请努力解释代码的作用以及它如何帮助@Manoj。只有代码的答案被视为low质量，可能会被删除。嗯，我认为答案过于精确和简单，无法解释。但无论如何，我已经对其进行了编辑。变量数据=[{“名称”：“ABC”，“分数”：34，“邮件”：“xyz”，“其他”：“blah”}，{“名称”：“定义”，“分数”：43，“邮件”：“iii”，“其他”：“fff”}]；是否有其他方法可以代替对每一行这样写？最后，我如何找到所选员工分数的最大值和平均值？您不喜欢这种写方法的哪一点？这是将数据存储在JavaScript/JSON中的最短方法。要获得分数的最大值和平均值，您必须在数组中的项目中循环，然后找到使用常规数学计算的最大/平均值。这只是一个循环和一些求和的例子。@ManojKumar您对此有何决定？如果答案对您有帮助，请记住将其标记为已接受-谢谢：-）