标签必须嵌套在内，否则无效；其直接子元素仅限、、；行内单元格需逻辑对齐列数；样式须用CSS作用于单元格而非；动态操作应使用insertRow()/deleteRow()等原生方法。
tr标签必须嵌套在table里，不能单独存在
直接写 <tr><td>数据</td></tr> 是无效的，浏览器会忽略或自动补全错误结构。<tr> 的语义是“表格中的一行”，它天然依赖 <code><table> 容器。没有 <code><table>，<code><tr> 就失去上下文，DOM 解析时可能被丢弃或移到 body 外部。
<p>常见错误现象：<br>页面没显示表格、开发者工具里看不到 <code><tr> 节点、CSS 选择器 <code>tr:hover 完全不生效。
- 正确结构只能是：
<table><tr> <td>A</td> <td>B</td> </tr></table> - 若用 JavaScript 动态插入，也得先确保父元素是
<table> 或已存在的 <code><tbody><li><code><tr> 允许的直接子元素只有 <code><th>、<code><td>、<code><template></template>（用于 Web Components），其他标签如<div> 会导致解析异常 <h3>一行里的单元格数量要对齐，否则语义和渲染都会出问题</h3> <p>同一张表里，所有 <code><tr> 应该有相同数量的列（即 <code><th> 或 <code><td>），尤其当用了 <code>colspan或rowspan时，必须手动计算“视觉列数”是否一致。否则表格会错位、表头和数据列错配、屏幕阅读器读错行列关系。比如表头是 4 列：
<th>姓名</th> <th>部门</th> <th>入职</th> <th>薪资</th>，那每一行<tr> 里的 <code><td> 也应逻辑上对应这 4 列。 <ul><li>用 <code>colspan="2"合并两个单元格，就相当于少了一个独立<td>，后面需补足总数（例如：1 个 <code>colspan="2"+ 2 个普通<td> = 视觉 4 列） <li>浏览器不会报错，但 <code>table-layout: fixed下列宽可能崩坏，打印预览时更明显 - 可借助 DevTools 的“Accessibility”面板检查行列关联是否被正确识别
- 想让某行高亮？用
<tr class="warning"> + <code>.warning td { background-color: #fff3cd; } - 想奇偶行变色？用
tr:nth-child(odd) td { background-color: #f9f9f9; } - 避免写
<tr style="background: #ccc"> —— 它无法被 :hover 或媒体查询覆盖，也不利于主题切换 <h3>动态添加/删除行要用 insertRow() 和 deleteRow()，别直接 innerHTML 拼接</h3> <p>用 <code>document.getElementById('myTable').innerHTML += '<tr><td>新行</td></tr>'看似简单，但会触发整个<table> 重绘，丢失已有事件监听、破坏 focus 状态、清空 input 值，还可能因 HTML 字符转义出错。 <p>原生 DOM 方法更可靠：</p> <ul><li>添加行：<code>tableEl.insertRow(-1)（-1 表示追加到末尾），再对返回的<tr> 调用 <code>insertCell(0)插入单元格 - 删除行：
tableEl.deleteRow(index)，index 从 0 开始，注意 tbody 里的行号 ≠ 整个 table 的行号 - 获取某行所有单元格：
trEl.cells是只读的 HTMLCollection，比trEl.querySelectorAll('td, th')更轻量
tr本身不控制对齐或背景，这些必须用CSS
HTML5 已废弃 <tr align="center">、<code><tr valign="top">、<code><tr bgcolor="#eee"> 等属性。现在所有样式都得走 CSS，而且推荐用 class 而非 <code>style 行内写法，便于复用和维护。
关键点在于：对齐是作用于单元格内容的，不是整行“居中”——text-align 控制水平，vertical-align 控制垂直，且必须设在 <td> 或 <code><th> 上，设在 <code><tr> 上无效（除非用 <code>tr td { ... } 这类后代选择器）。
复杂交互（如拖拽排序、编辑状态保存）建议配合 <tbody> 分组管理，避免操作影响 <code><thead> 或 <code><caption></caption>。
