table 的 summary 属性已废弃，现代浏览器和屏幕阅读器均忽略它；应改用 、scope/headers 和 aria-describedby 协同实现可访问性。
summary 属性不能写，写了也没用，现代浏览器和屏幕阅读器都忽略它。
table 的 summary 属性已废弃，别再用了
HTML5 明确废除了 table 的 summary 属性。Chrome、Firefox、Edge 等主流浏览器解析时直接跳过，DOM 中查不到，CSS 无法样式化，JS 读取到的值只是字符串，不带任何语义。NVDA、JAWS、VoiceOver 这些主流屏幕阅读器基本不读它——有的旧版 JAWS 甚至会因检测到该属性而跳过整张表。
- 错误示例：
<table summary="用户基本信息表"> <li>构建工具（如 HTMLHint、eslint-plugin-jsx-a11y）会报 <code>obsolete attribute错误，CI 可能直接失败 - 它不是“后台备注”，也不是 SEO 优化项，对搜索排名零影响
-
<caption></caption>必须是<table> 的第一个子元素，内容要具体，比如 <code><caption>2024 年 Q3 华南区订单履约时效（单位：小时）</caption>，不能写“数据表”“订单表”这种空泛描述 - 每个
<th> 都该加 <code>scope="col"（列头）或scope="row"（行头），让屏幕阅读器知道单元格归属哪一维 - 复杂表头（跨行/跨列）必须用
id+headers显式绑定，例如<td headers="q1 q2">87%</td> - 若需补充口径说明、异常标注等细节，用
aria-describedby指向一段隐藏但可读的文字，且该文字不能用display: none或aria-hidden="true" -
<caption></caption>被塞进<thead> 或用 CSS 移到表格底部 —— 语义断裂，部分读屏直接跳过 <li>动态渲染表格后，没同步设置 <code>aria-describedby引用的 ID，导致 DOM 中找不到目标节点，读屏无法关联说明 - 只加了
<caption></caption>，但所有<th> 都没补 <code>scope—— 屏幕阅读器只能读出“北京”“12.3%”，却不知道“这是北京的环比增长率”可访问性不是加个属性就完事，而是
<caption></caption>、scope/headers、aria-describedby三者必须同时存在且指向一致——缺一环，数字就变成无上下文的孤岛。
真正起作用的是 <caption></caption> + scope + aria-describedby
可访问性靠结构协同，不是靠单个属性“打补丁”：
迁移时最容易漏掉的三件事
把旧代码里的 summary= 替掉，不代表表格就可访问了：
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
