如何使用插入单元格和插入行在javascript中使用for循环在表格的每一行内插入单元格答案

【问题标题】：How to insert the cells inside of each row for a table with a for loop in javascript using insert cell and insert row如何使用插入单元格和插入行在javascript中使用for循环在表格的每一行内插入单元格
【发布时间】：2021-01-17 16:32:35
【问题描述】：

function tablefunction(rows, cols) {
    var table = document.getElementById("myTable")
    var row = table.insertRow()
    var cell = row.insertCell()
    for (r = 0; r < rows; r++) {
        table.insertRow(r)
        for (c = 0; c < cols; c++) {
            row.insertCell(c)

目前的结果

<tbody>
    <tr>
    <tr>
    <tr>
    <tr>
    <tr>
    <tr>
    <tr>
    <tr>
        <td>
        <td>
        <td>
        <td>
        <td>..... goes on for 64 tds

我想要做的是每个 TR 有 8 个 tds，但我不知道怎么做，因为如果我在第一个 for 循环中有 insertcell，它会做同样的事情，如果我有在插入行之前插入单元格，它会导致错误，因为表格不是这样工作的。

期望的结果：

<tbody>
    <tr>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
    <tr>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
    <tr>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
        <td>
etc etc for 8 trs.

【问题讨论】：

标签： javascript html dynamic html-table row

【解决方案1】：

通过在第一个循环中设置当前行来解决。

function tablefunction(rows, cols) {
    var table = document.getElementById("myTable")
    var row = table.insertRow(0);
    var cell = row.insertCell(0);
    for (r = 0; r < rows; r++) {
        row = table.insertRow(r);
    for(c=0;c<cols;c++){
        cell = row.insertCell(0);
        cell.innerHTML = `${r} ${c}`
      }
    }
  }
 tablefunction(4,4);

&lt;table id="myTable" cellspacing="40"&gt;&lt;/table&gt;

【讨论】：