javascript - Html 表格拆分列一分为二？

Question

我有一个我迭代的元素数组，并为每个元素创建 <td></td>.

如果我有10 个元素，它将创建一个具有 1 列和 10 行的表格。

有没有办法拆分(在 HTML 或 CSS 中)将该列分成两半，所以我最终得到 2 列和 5 个元素？

Answer 1

您可以使用这样的代码:

var table = document.createElement('table');
var array = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'];
for (var i=0; i<array.length; i+=2) { // iterate every 2 items
  var tr = document.createElement('tr');
  var td = document.createElement('td');
  td.innerHTML = array[i]; // first element
  tr.appendChild(td);
  td = document.createElement('td');
  td.innerHTML = array[i+1]; // second element
  tr.appendChild(td);
  table.appendChild(tr);
}
document.getElementsByTagName('body')[0].appendChild(table);

table td { border: 1px solid black; }