必须显式设置aria-selected="true"，且需满足：①父容器为role="tablist"；②对应tabpanel用aria-labelledby关联tab ID；③tab元素设tabindex="0"并动态管理焦点。
role="tab" 的 li 元素如何声明当前选中状态
不能只靠 role="tab" 自动识别选中态；必须显式设置 aria-selected="true"，且需配合 tablist 容器和键盘导航逻辑才能被屏幕阅读器正确识别。
必须同时满足的三个条件
单独给 <li> 加 role="tab" 和 aria-selected="true" 不够，它只是“一个 tab”，不是“可交互的 tab 组件”。要让语义完整、行为可用，得：
-
<ul role="tablist">作为父容器（不能是<div>或无 role 的<ul>） - 每个
<li role="tab">都要有aria-selected="true"或"false"，且仅一个为"true" - 对应的内容区（
<div role="tabpanel">）必须用aria-labelledby指向该 tab 的id
常见错误：只加 aria-selected 却漏掉 tabindex
即使设置了 aria-selected="true"，如果该 <li> 没有可聚焦能力，键盘用户无法用 Tab 键进入、用方向键切换——它就不是真正可用的 tab。必须手动加 tabindex="0"（选中项）或 tabindex="-1"（非选中项），并用 JS 动态管理焦点。
示例片段：
立即学习“前端免费学习笔记（深入）”；
<ul role="tablist"> <li role="tab" id="tab-home" aria-selected="true" tabindex="0">首页</li> <li role="tab" id="tab-about" aria-selected="false" tabindex="-1">关于</li> </ul> <div role="tabpanel" aria-labelledby="tab-home">...</div>
为什么不用 CSS 类名或 data-* 属性代替 aria-selected
因为 aria-selected 是唯一被主流屏幕阅读器（NVDA、VoiceOver、JAWS）用于播报“已选中”状态的属性。仅用 class="active" 或 data-active="true" 对辅助技术完全不可见。而且，WAI-ARIA 规范明确要求：当 role="tab" 存在时，aria-selected 是必需属性（required），不设即算语义错误。
另外注意：aria-selected 值必须是字符串 "true" 或 "false"，不能写成布尔值 true 或省略引号。
