表格由脚本生成时，给每个单元格分配 id 是为了后续能精确定位。常见偏差是把 id 写在行上，或者用循环变量直接拼接导致重名。
分配规则
id 需要同时满足两点：文档内唯一、能从数据反推。用行标识加列序号组合，比单纯递增数字更稳。
rows.forEach((row) => {
const tr = document.createElement('tr');
cells.forEach((cell, c) => {
const td = document.createElement('td');
td.id = `cell-${row.key}-${c}`;
td.textContent = cell;
tr.appendChild(td);
});
});纯数字 id 的问题
id 取值为单个数字在页面里合法，但同一页出现第二张表格就会冲突。以数字开头的 id 在 CSS 选择器里还需要转义，定位反而更麻烦。
按 id 改样式
const td = document.getElementById(`cell-${key}-${col}`);
if (td) td.classList.add('is-alert');取到节点后改类名，而不是直接写行内样式。样式集中在样式表里，后续调整不必改脚本。
更省事的替代
| 做法 | 适用 |
|---|---|
| id 定位 | 需要跨时刻访问特定格 |
| data 标记 | 需要按业务值批量筛选 |
| 事件委托 | 只处理点击，不需要 id |
注意点
- 重渲染时要清理旧节点，否则 id 仍被残留节点占用。
- id 不要包含空格与引号，拼接前对业务值做一次转义。
- 数量很大时改用事件委托，避免为每个格子绑定监听。