summary属性在现代HTML中已失效，不被屏幕阅读器读取，主流浏览器完全忽略并报警告；应改用caption（作为table首个子元素）和th的scope属性来保障可访问性。
summary 属性在现代 HTML 中已失效，不能用于辅助功能兼容。它不会被屏幕阅读器读取，Chrome、Firefox、Edge 等主流浏览器自 HTML5 起完全忽略该属性，控制台还会报警告：The 'summary' attribute on the 'table' element is obsolete. 真正起作用的是 <caption> 和 scope 属性。
为什么summary对辅助功能没用
浏览器不向辅助技术传递 summary 值，屏幕阅读器无法感知其内容；即使 DOM 中仍能通过 table.summary 读到字符串，也仅是遗留字段，无语义意义。若表格只有 summary 而无 <caption>，多数屏幕阅读器会直接报“未命名表格”，用户根本不知道这是什么表。
<caption>必须作为<table>第一个子元素
<caption> 是表格可访问性的起点，它提供明确的上下文描述：
- 必须紧接在
<table>开始标签后，不可包裹在<div>或其他容器中 - 文本应具体，比如
<caption>2024 年 Q3 各地区销售额（单位：万元）</caption>，而非“数据表格”这类泛称 - 支持 CSS 样式，但不要用
display: none或visibility: hidden隐藏，否则会破坏可访问性
为<th>补全scope属性才能建立行列关联
仅靠 <caption> 不足以让屏幕阅读器理解单元格归属关系，必须配合 scope：
立即学习“前端免费学习笔记（深入）”；
- 列标题用
<th scope="col">姓名</th>，告诉辅助工具“这一列所有<td>都属于‘姓名’字段” - 行标题（如首列分类名）用
<th scope="row">华东</th> - 复杂表头（跨行/跨列）需改用
id+headers显式绑定，scope不适用 - 漏写
scope会导致屏幕阅读器朗读时丢失行列上下文，例如把“张三｜销售｜8500”读成孤立的三个词，而非“张三的岗位是销售，薪资是8500”
真正影响辅助技术解析的，是结构是否清晰——<caption> 定义“这是什么表”，scope 定义“每个数对应哪一维”，而 summary 只是一个早已被移除的语义路标，留着反而干扰判断。
