从2D JavaScript数组生成超文本标记语言表格
从2D JavaScript数组生成超文本标记语言表格
提问于 2013-03-02 02:42:20
在JavaScript中，可以从一个2D数组生成一个超文本标记语言表格吗？编写超文本标记语言表格的语法往往非常冗长，所以我想从一个2D JavaScript数组生成一个超文本标记语言表格，如下所示：
[
["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>因此，我正在尝试编写一个从2D JavaScript数组中返回表的JavaScript函数，如下所示：
function getTable(array){
// take a 2D JavaScript string array as input, and return an HTML table.
}回答 14
Stack Overflow用户
回答已采纳
发布于 2013-03-02 03:01:16
下面是一个函数，它将使用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"]]);Stack Overflow用户
发布于 2013-03-02 02:50:17
使用double for循环很容易做到这一点。
function makeTableHTML(myArray) {
var result = "<table border=1>";
for(var i=0; i<myArray.length; i++) {
result += "<tr>";
for(var j=0; j<myArray[i].length; j++){
result += "<td>"+myArray[i][j]+"</td>";
}
result += "</tr>";
}
result += "</table>";
return result;
}Stack Overflow用户
发布于 2015-02-11 07:36:57
另一个innerHTML-less版本。
function makeTable(array) {
var table = document.createElement('table');
for (var i = 0; i < array.length; i++) {
var row = document.createElement('tr');
for (var j = 0; j < array[i].length; j++) {
var cell = document.createElement('td');
cell.textContent = array[i][j];
row.appendChild(cell);
}
table.appendChild(row);
}
return table;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15164655
复制相关文章
相似问题