直接给 设 id 属性最可靠，但必须全局唯一；insertrow().innerhtml = '...' 不生效，因返回的是 dom 对象，外层 标签被浏览器剥离，id 丢失。
直接给 <tr> 元素设 <code>id 属性是最简单、最可靠的方式，但必须确保每个 ID 全局唯一，且不能依赖 insertRow() 后再用 innerHTML 覆盖——那样会丢掉 ID。
为什么 insertRow().innerHTML = '<tr id="xxx">...</tr>' 不生效
因为 insertRow() 返回的是一个原生 <tr> 元素对象，它本身**已经是一个 DOM 节点**。你再对它赋值 <code>innerHTML，等价于往这个空 <tr> 里塞内容，浏览器会自动剥离你字符串里的外层 <code><tr> 标签，只留下 <code><td> 等子内容。所以 <code>id="xxx" 直接被丢弃，DOM 中根本找不到该 ID。
-
insertRow()返回的是HTMLTableRowElement，不是字符串 -
.innerHTML = '<tr id="x"><td>...</td></tr>'实际插入的是<td>...</td>，外层<tr> 被忽略 <li>最终生成的 <code><tr> 没有 <code>id，document.getElementById('x')查不到正确设置行 ID 的两种方式（推荐后者）
核心原则：要么操作 DOM 对象属性，要么统一用字符串拼接，不混用。
- 方式一（推荐）：拿到
<tr> 对象后直接设 <code>idconst row = tab.insertRow(-1);row.id = `row-${rowCount}`;rowCount++;- 方式二：用
innerHTML +=拼接完整<tr> 字符串<br><code>tbody.innerHTML += `<tr id="row-${idCounter}"><td>data</td></tr>`;
注意：必须追加到<tbody>（或 <code><table>），不能作用于 <code>insertRow()返回的对象如何用这个行 ID 精准定位单元格
有了行 ID，后续查单元格就非常直接，不需要遍历或依赖索引错位：
- 查第 2 列的
<td>：<code>document.querySelector('#row-3 td:nth-of-type(2)') - 查某列名对应的单元格（需表头在
<tr> 内）：<code>document.querySelector('#row-3 th:contains("Name")').nextElementSibling（jQuery）或用Array.from(row.querySelectorAll('th'))手动匹配（原生） - 避免用
:nth-child(n)—— 如果某行开头有<th> 或合并单元格，序号会偏移；<code>:nth-of-type(td)更稳真正容易被忽略的是 ID 唯一性校验和 DOM 更新时机：动态添加后立即用
getElementById查不到，往往是因为你用了错误的赋值方式，或者没等 DOM 渲染完成（一般不用等，但若用innerHTML +=后立刻查，要确认拼接字符串语法无误、标签闭合正确）。
- 方式二：用
- 方式一（推荐）：拿到
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
