从2D JavaScript数组生成HTML表

  • Z时代
  • 2024-01-10
  • 分类：问答

在JavaScript中，是否可以从2D数组生成HTML表？编写HTML表的语法往往非常冗长，因此我想从2D

JavaScript数组生成HTML表，如下所示：

[["row 1, cell 1", "row 1, cell 2"], 
 ["row 2, cell 1", "row 2, cell 2"]]

会成为：

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

因此，我试图编写一个JavaScript函数，该函数将从2D JavaScript数组返回一个表，如下所示：

function getTable(array){
    //take a 2D JavaScript string array as input, and return an HTML table.
}

回答：

这是一个将使用dom而不是字符串连接的函数。

function createTable(tableData) {
  var table = document.createElement('table');
  var tableBody = document.createElement('tbody');
  tableData.forEach(function(rowData) {
    var row = document.createElement('tr');
    rowData.forEach(function(cellData) {
      var cell = document.createElement('td');
      cell.appendChild(document.createTextNode(cellData));
      row.appendChild(cell);
    });
    tableBody.appendChild(row);
  });
  table.appendChild(tableBody);
  document.body.appendChild(table);
}
createTable([["row 1, cell 1", "row 1, cell 2"], ["row 2, cell 1", "row 2, cell 2"]]);

以上是 从2D JavaScript数组生成HTML表 的全部内容， 来源链接： utcz.com/qa/401641.html

回到顶部