使用 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>');
}

当我从 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>');
}

arrays arrays foreach javascript undefined