微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

使用 JS forEach 将多维数组转换为 html table

如何解决使用 JS forEach 将多维数组转换为 html table

我对 Javascript 数组的经验很少。我有一个足够复杂的需求,我需要将数据放入一个数组中,然后生成一个 HTML 表。在这个例子中,我有一个多维数组用于排行榜,其中每个值都是团队分数的数组。

我在 forEach 中嵌套了一个 forEach 来构造行和单元格。但是,我一直在顶部收到两个“未定义”的回复,每个团队一个。我觉得和forEach方法的thisValue部分有关系,但我无法阻止或替换它。

我确定这不是设置它的正确方法,但如果现在可以通过小幅调整使其工作,那将是理想的。查看图片。任何帮助表示赞赏!

leaderBoard.forEach(row);

function row(value,index,array)
{
    document.write('<tr>' + value.forEach(cell) + '</tr>');
}

function cell(value,array)
{
    document.write('<td>' + value + '</td>');
}

enter image description here

当我从 row 函数删除对 cell 函数的引用时,它返回数组并且“undefinedundefined”消失。请注意,我删除了“.forEach(cell)”并添加了数据标签

function row(value,array)
{
    document.write('<tr><td>' + value + '</td></tr>');
}

Table without undefined at top

解决方法

我认为这会完成你想要的

leaderBoard.forEach(function (row) {
  row.forEach(function (cell) {
      document.write('<tr><td>' + cell + '</td></tr>');
    });
});

您尝试删除对单元格函数的引用已关闭。问题是您将整行写入 1 个单元格

//value = [AM,90,76,67,233]
function row(value,index,array)
{
    document.write('<tr><td>' + value + '</td></tr>');
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。