为何code1循环无法为table添加25个<tr>元素？（新手求助）

核心差异：DOM元素对象 vs 字符串解析 #

• code1的问题：你只创建了一个<tr> DOM元素对象，循环里反复执行appendChild时，浏览器遵循规则：同一个DOM元素不能同时存在于DOM树的多个位置。每次append操作都会把这个唯一的<tr>从当前位置（第一次是从内存中，之后是从表格内）移动到表格末尾，循环25次等于把这一行移了25次，最终表格里自然只剩一行。
• code2的正常逻辑：你通过字符串拼接每次生成新的<tr>字符串，执行innerHTML +=或append时，浏览器会把每段新字符串解析成全新的DOM元素对象。每一次循环都生成一个独立的<tr>，因此最终表格里会有25个不同的行元素。

补充修复方案（基于code1思路） #

如果想保留创建DOM元素的方式实现多行，需要把创建<tr>的代码放到循环内部，每次生成新的元素：

const table = document.querySelector('table');
for(let i = 0; i < 25; i++){
  const tr = document.createElement('tr');
  tr.innerHTML = `<td>行${i+1}</td>`;
  table.appendChild(tr);
}

内容的提问来源于stack exchange，提问作者Anh Nguyễn Thế