如何简化JavaScript插入表格行的重复代码？

你的问题出在把行插入操作放在了循环内部，导致每次循环都会新增一行，而且所有单元格都被设置为"Totals"，完全偏离了原需求。原代码是要插入1行，然后在这一行里添加5个单元格并填充不同内容，正确的简化方式如下：

正确简化代码 #

// 先创建唯一的一行，放在循环外面
let Mrow = table.insertRow(12);
// 准备要填充的内容数组，顺序对应单元格0到4
const cellContents = ["Totals", Msum1, Msum2, Msum3, Msum4];

// 循环创建单元格并填充内容
for(let cellIndex = 0; cellIndex < cellContents.length; cellIndex++){
    let currentCell = Mrow.insertCell(cellIndex);
    currentCell.innerHTML = cellContents[cellIndex];
}

代码说明 #

• 把insertRow(12)移出循环，确保只插入一行，避免重复创建行。
• 用数组cellContents统一管理所有单元格的内容，让代码更清晰，后续修改内容只需调整数组即可。
• 循环遍历数组长度，动态创建单元格并填充对应位置的内容，避免重复的变量声明和赋值。

为什么你的尝试失败？ #

你之前的代码在循环里每次都执行table.insertRow(12)，这会连续插入5行，而且每个单元格都设置为"Totals"，完全不符合原代码要实现的"一行多单元格"的需求。

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