直接为<table>设置唯一id即可，如<table id="data-table"></table>；动态添加的tr/td需在insertRow()/insertCell()后立即用rowIndex/cellIndex赋id，避免重复或class误用。
直接给 <table> 设置 id 属性就行
不需要额外封装或嵌套，只要确保这个 id 在整个页面中唯一即可。浏览器原生支持通过 document.getElementById("myTable") 快速获取表格对象，这是后续所有操作的基础。
常见错误是把 id 设成重复值（比如多个表格都用 id="tab"），或者误写为 class —— 这会导致 getElementById 返回 null，脚本直接报错 Cannot read property 'insertRow' of null。
- ✅ 正确写法：
<table id="data-table"></table> - ❌ 错误写法：
<table class="data-table"></table>（查不到） - ❌ 错误写法：
<table id="tab"></table><table id="tab"></table>（ID重复）
动态生成的 <tr> 和 <td> 怎么设 ID？
不能靠 HTML 模板硬编码，得在 JS 插入元素后立刻赋值。关键点是：每次调用 insertRow() 或 insertCell() 都会返回新元素的引用，你必须立刻用它设置 id 属性。
推荐用 rowIndex 和 cellIndex，而不是手动维护计数器——前者由浏览器自动维护，删行、插行都不影响索引准确性。
立即学习“前端免费学习笔记（深入）”；
const row = table.insertRow(); row.id = `row-${row.rowIndex}`;for (let i = 0; i- 注意：
cellIndex从 0 开始，但人类习惯列号从 1 起，所以要加 1
为什么不用 setAttribute('id', ...)？
可以，但没必要。直接赋值 cell.id = "xxx" 更快、更直观，且兼容性无差别。而 setAttribute 在处理布尔属性（如 disabled）时有特殊语义，对 id 这种纯字符串属性反而多一层函数调用开销。
唯一需要 setAttribute 的场景是：你想同时设置多个属性（比如 id + data-value），且想复用同一段逻辑批量操作——但这属于进阶封装，日常单次赋值直接用点号语法就够了。
ID 命名里能用方括号或点号吗？
能写，但别这么干。HTML5 允许 ID 包含字母、数字、下划线、连字符和点号，但点号（.）在 CSS 选择器里是类名标识符，document.querySelector("#R1.C1") 会误解析成“ID 为 R1 且 class 为 C1”的元素，实际得写成 document.querySelector("#R1\.C1")（需转义）。
方括号（[、]）同理，在 jQuery 或 CSS 中都要额外转义，徒增维护成本。
- ✅ 推荐：
R1C1、row-5、cell_2_7 - ❌ 避免：
R1.C1、total[3]、item.0
ID 是为了被快速定位，不是为了表达复杂结构。真正需要结构化信息的地方，该用 data- 属性存，而不是塞进 ID 里。
