aria-colindex仅在role="grid"或role="treegrid"容器中有效，不可用于原生/；必须配合aria-colcount及每个gridcell的1-based列索引，且需严格对应完整逻辑列位置。

aria-colindex 只在 role="grid" 里有效，原生

加了也白加

直接给 <td> 或 <code><th> 写 <code>aria-colindex，屏幕阅读器会无视它，甚至报错。WAI-ARIA 规范明确禁止这种用法。它只被允许出现在设置了 role="grid" 或 role="treegrid" 的容器上，且必须配合 aria-colcount 和每个 role="gridcell" 的显式声明。

常见错误是：以为只要加了 aria-colindex="5" 就能“告诉读屏这是第 5 列”，结果用户听到的还是 DOM 顺序里的第 1 个单元格。根本原因是你还在用原生 <table> 结构——它的列逻辑靠 <code><colgroup></colgroup> 和 DOM 顺序推断，不认 aria-colindex。

• 想用 aria-colindex？必须放弃 <table>，改用 <code><div role="grid"> + <code><div role="row"> + <code><div role="gridcell"> <li>原生表格要控制列语义，优先用 <code><colgroup><col></colgroup> 配合 scope 或 headers
• 如果只是加了 display: none 隐藏某些列，又没同步调整 aria-colcount，读屏会数错总列数，导致 aria-colindex 映射彻底错乱

虚拟长表格中，aria-colindex 必须严格按逻辑列编号，不是视觉列号

在虚拟滚动或稀疏渲染场景下（比如只渲染可视区域的 5 列，但整表有 100 列），aria-colindex 值必须反映该单元格在整个逻辑表格中的真实列位置，哪怕中间几十列完全没渲染出来。

例如：某行只渲染了“姓名”（逻辑第 1 列）、“邮箱”（逻辑第 2 列）和“最后登录时间”（逻辑第 47 列），那对应三个 gridcell 的 aria-colindex 就得是 1、2、47，不能写成 1、2、3。

• aria-colindex 是 1-based 整数，不允许为 0 或负数
• 跳过中间列（如从 2 直接到 47）合法，但数值必须准确；漏掉或写错会导致读屏把“最后登录时间”当成第 3 列内容
• 未渲染的列不能留空——要么不渲染，要么用 aria-hidden="true" + 占位 gridcell 并设正确 aria-colindex，否则行列对齐会崩
• 如果用了 CSS grid-column: span 2 实现视觉合并，aria-colindex 仍只标起始列号，不标跨度；跨列语义靠布局逻辑隐含，不靠 ARIA 模拟

aria-colcount 和 aria-colindex 必须配套，且值要动态同步

aria-colcount 不是“当前渲染了几列”，而是“这张表总共多少逻辑列”。它和 aria-colindex 是绑定关系：所有出现的 aria-colindex 值都必须落在 1 到 aria-colcount 范围内。


Doc To HTML
使用 MinerU 文档处理引擎将 Word 文档（.doc、.docx）转换为保留结构和格式的干净 HTML。
下载

典型坑点：后端返回 80 列数据，前端做筛选后只显示其中 12 列，但 aria-colcount 还设成 "12" —— 这会让读屏误判整表只有 12 列，一旦用户导航到 aria-colindex="47" 的单元格，就会出错或跳过。

• 动态表格中，aria-colcount 应取原始数据的列总数，不是当前视图列数
• 列筛选、排序、隐藏等操作，只影响哪些 gridcell 被渲染，不影响 aria-colcount 和各 aria-colindex 的数值
• 若列结构本身会变化（比如用户拖拽重排列），需重新计算每列的逻辑序号，并批量更新所有已渲染单元格的 aria-colindex
• 旧版 JAWS（2022 以前）和部分 VoiceOver 版本对 aria-colcount 支持差，必须配 tabindex="0" 让容器可聚焦，否则根本不进网格浏览模式

比硬塞 aria-colindex 更稳的替代路径

如果你发现手动维护 aria-colindex 总是出错，或者团队缺乏 ARIA 深度经验，优先考虑绕过它。

真正的大数据量表格，原生 <table> + <code>table-layout: fixed + <colgroup></colgroup> + 虚拟滚动库（如 virtuoso）组合，语义更稳、兼容性更好、开发成本更低。ARIA grid 模式对键盘导航、焦点管理、动态更新要求极高，一个 aria-rowindex 没对齐，整个网格就不可用。

• 原生 <table> 中，用 <code><col width="120"> 显式定义列宽，比 JS 算 aria-colindex 可靠得多
• 需要列冻结或懒加载？用 position: sticky 配合 <thead> 固定，而不是切分成多个 <code>role="grid"
• 若必须用自定义 grid，别手写滚动逻辑——用 react-window 或 vue-virtual-scroller，它们内置了 ARIA 属性自动注入，且做了大量兼容性 patch
• 测试时别只听 NVDA：JAWS 和 VoiceOver 对 aria-colindex 解析逻辑不同，尤其在嵌套 grid 或动态增删行时，行为差异很大