summary属性已从HTML5移除，现代浏览器完全忽略且屏幕阅读器不播报；唯一合法标题是caption元素，必须作为table首个子元素并含具体信息；表头语义需通过scope或headers属性明确定义。
summary 属性不能可靠添加表格描述，它已从 HTML5 中移除，主流浏览器完全忽略，别用。
为什么 summary 不起作用
Chrome、Firefox、Edge 等现代浏览器不读取、不渲染、不传递 summary 的值，控制台会明确报错：The 'summary' attribute on the 'table' element is obsolete。即使 JS 能通过 table.summary 读到字符串，屏幕阅读器也根本不会播报它——用户听到的仍是“未命名表格”。
<caption></caption> 是唯一合法标题入口
<caption></caption> 必须作为 <table> 的第一个子元素，且内容要具体可理解：
<ul>
<li>
<code><caption>2024 年 Q2 用户退款申请汇总</caption> ✅（谁、什么、何时）
<caption>数据表</caption> ❌（模糊，无实质信息）<caption></caption> 文本，否则读屏仍播报旧上下文caption-side: bottom
scope 和 headers 才真正定义表头语义
scope 是 <th> 的属性，不是 <code><table> 的，它告诉辅助技术这个表头管哪部分数据：
<ul><li><code><th scope="col">姓名 → 管它下方整列 <code><td>
<li><code><th scope="row">张三 → 管它右侧整行 <code><td>
<li>复杂表头（跨行/跨列）需配合 <code>id 和 headers 显式绑定，例如 <th id="age">年龄</th> + <td headers="age">28
<li>不要给 <code><td> 加 <code>scope，无效且可能干扰解析
迁移旧代码时最容易漏掉的点
搜 summary= 替换不等于完事：
立即学习“前端免费学习笔记（深入）”；
- 原
summary="用户订单列表"不能直接塞进<caption></caption>就完事——得补全关键信息，比如变成<caption>2026年7月用户订单列表（共142条）</caption> -
<caption></caption>必须紧跟<table> 开始标签，中间不能插注释、空格或其它元素 <li>所有 <code><th> 都该有 <code>scope，哪怕只有一行表头；没加的话，屏幕阅读器可能把第一行当成普通数据行读出来 真正让表格被理解的，是结构本身：一个紧贴<table> 的 <code><caption></caption>，加上每个<th> 上明确的 <code>scope或headers关联——而不是一段藏在属性里、早已失效的文本。
