aria-rowspan 不是标准属性，wai-aria 规范中不存在，浏览器和屏幕阅读器均不识别；应使用 headers 属性显式绑定表头，或改用语义化结构如 dl/dt/dd、treegrid 或 css grid 避免 rowspan 的可访问性缺陷。
aria-rowspan 不是标准属性，浏览器和屏幕阅读器都不识别它——想靠这个实现可访问的行合并，行不通。
为什么 aria-rowspan 不存在也不起作用
WAI-ARIA 规范里根本没有 aria-rowspan 这个属性。ARIA 的目标是补充语义，不是复制 HTML 布局属性。HTML 的 rowspan 本身已是结构性声明，但它的可访问性缺陷（比如屏幕阅读器无法自动关联跨行单元格与表头）不能靠虚构一个 ARIA 属性来修复。
- 所有主流屏幕阅读器（NVDA、VoiceOver、JAWS）只响应真实存在的 ARIA 属性，如
aria-labelledby、headers、role="grid"等 - 写
aria-rowspan="3"不会改变任何行为，开发者工具里也看不到对应语义暴露 - 若误以为它有效，反而会掩盖真正需要处理的语义断裂问题
替代方案：用 headers 显式绑定被跨行单元格
当 rowspan 跨越多行时，后续行中原本该有表头的位置被留空，屏幕阅读器就“断联”了。解决办法是让每个数据单元格主动指明它属于哪些表头：
- 给每个
<th> 设置唯一 <code>id，例如<th id="dept">部门</th> - 给跨行影响下的每个
<td> 添加 <code>headers属性，列出对应表头的id，例如<td headers="dept course">数学</td> - 即使该
<td> 在视觉上没挨着 <code><th id="dept">，<code>headers也能强制建立语义关联注意：
headers值是空格分隔的 ID 列表，不是逗号，也不是 CSS 选择器。更健壮的做法：避免
rowspan，改用语义化结构 + CSS复杂跨行表格几乎必然伴随可访问性风险。与其在
rowspan上打补丁，不如换结构：- 用
<dl></dl>+<dt>/</dt> <dd></dd>模拟“主项-子项”关系，天然支持嵌套与语音导航 - 用
role="treegrid"配合aria-expanded和aria-level实现可折叠课程表或组织架构 - 纯 CSS Grid 布局配合
aria-hidden="true"隐藏装饰性线条，把数据逻辑交给语义化标签，视觉样式交给 CSS
这类方案不依赖
rowspan的网格锁定机制，也就绕开了它带来的列偏移、JS 读取异常、屏幕阅读器跳行等连锁问题。真正难的不是写对
rowspan数值，而是让每个被跨过的单元格依然能被准确说出“这是谁的数据”。这一步漏掉，再多的视觉合并都只是对健全用户的妥协。 - 用
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
