JS生成10x10表格实现1-100数字逐行顺序填充方案

现有代码的单元格填充逻辑有误：内层列循环生成单元格内容时，直接取外层行循环的变量i作为填充值，没有将列序号j纳入数值计算，因此每行10个单元格都会重复显示当前行号，最终出现每行重复填充1-10的问题。

正确的单元格数值计算规则：

• 行号i从1开始计数时，第i行的起始值为 (i-1)*10 + 1
• 列序号j从0开始计数时，当前单元格的数值为 (i-1)*10 + j + 1

仅需修改内层循环中创建文本节点的代码行即可，修改后的完整JS代码如下：

function generate_table() {
  const tbl = document.createElement("table");
  const tblBody = document.createElement("tbody");
  for (let i = 1; i < 11; i++) {
    const row = document.createElement("tr");
    for (let j = 0; j < 10; j++) {
      const cell = document.createElement("td");
      // 原代码此处直接传入i，替换为计算后的正确数值
      const cellText = document.createTextNode((i - 1) * 10 + j + 1);
      cell.appendChild(cellText);
      row.appendChild(cell);
    }
    tblBody.appendChild(row);
  }
  tbl.appendChild(tblBody);
  document.body.appendChild(tbl);
  tbl.setAttribute("border", "1");
}

原有HTML代码无需调整，保持如下写法即可：

<form action="#">
  <input type="button" value="Generate a table" onclick="generate_table()">
</form>

修改后点击生成按钮，即可得到符合预期的10×10表格：第一行填充1-10，第二行填充11-20，逐行递增，最后一行填充91-100。

内容的提问来源于stack exchange，提问作者user19163646