tabindex="-1"使元素可脚本聚焦但不参与tab导航，适用于模态框等临时聚焦场景；避免使用正数tabindex，优先依靠dom顺序+tabindex="0"实现稳定无障碍聚焦。
tabindex 为负值时按钮能被脚本聚焦但不参与自然 Tab 导航
当按钮需要在特定交互后获得焦点（比如模态框打开、表单校验失败），又不想干扰页面默认的 Tab 顺序，tabindex="-1" 是最常用解法。它让元素可被 element.focus() 主动聚焦，但不会出现在 Tab 键循环里。
常见错误是给多个按钮都设 tabindex="-1" 后，以为用 JS 聚焦就能“接管”导航逻辑——其实没解决 Tab 键按下去往哪走的问题，用户仍会跳过这些按钮。
- 只对当前需临时聚焦的按钮设
tabindex="-1"，其他保持默认（tabindex="0"或无该属性） - 模态框关闭时，记得把原
tabindex="-1"按钮的属性移除或重置为tabindex="-1"以外的值，否则下次打不开 - 不要用
tabindex="-1"配合aria-hidden="true"，两者冲突：前者允许聚焦，后者告诉屏幕阅读器忽略
tabindex 大于 0 会强制插入 Tab 序列，但顺序不可靠
tabindex="1"、tabindex="5" 这类正整数确实能让按钮提前进入 Tab 流，但实际顺序取决于所有正 tabindex 元素的数值大小，且浏览器会把它们**全部排在默认顺序（tabindex="0" 或无值元素）之前**。这很容易导致意外跳转。
例如页面有三个按钮：btnA（tabindex="2"）、btnB（tabindex="0"）、btnC（tabindex="1"），Tab 顺序是 btnC → btnA → btnB，而非 DOM 顺序。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 避免使用大于 0 的
tabindex，除非你完全控制整个页面所有可聚焦元素的tabindex值 - 若必须用，确保所有正数
tabindex值连续且从 1 开始，否则中间空缺会被忽略（tabindex="1"和tabindex="3"之间没有2，3也不会生效） - 移动端 Safari 对正
tabindex支持不稳定，部分版本直接忽略
真正可控的聚焦顺序靠 DOM 位置 + tabindex="0"
最稳定、无障碍友好的做法，是让按钮在 HTML 中的物理位置匹配预期导航顺序，并统一用 tabindex="0"（或干脆不加，因为 <button></button> 默认可聚焦）。
比如筛选区按钮应在筛选结果上方，提交按钮应在表单底部——不是靠 tabindex “拖拽”，而是靠结构本身表达逻辑流。
- 用 CSS
order或flex-direction: column-reverse改变视觉顺序时，务必同步调整 DOM 顺序，否则键盘导航和屏幕阅读器仍按原始 DOM 走 - 隐藏按钮（如用
display: none）会自动退出 Tab 流，但visibility: hidden或opacity: 0不会，需手动加tabindex="-1"或aria-hidden="true" - 动态插入的按钮（如 JS 渲染的分页控件），插入位置必须符合语义流，不能一律 append 到 body 底部
测试键盘导航是否真可靠，别只看 Tab 键
只按 Tab 键测试容易漏掉关键问题：Shift+Tab 是否反向正确？Enter/Space 是否触发动作？焦点样式是否清晰可见？屏幕阅读器是否读出合理角色和标签？
- 用 Chrome DevTools 的“Rendering”面板开启
Emulate focus查看焦点环是否被 CSSoutline: none彻底抹掉 - 在 macOS 上用 VoiceOver（Cmd+F5），Windows 上用 NVDA，听按钮的朗读内容是否包含上下文（比如“删除第3项”而非仅“删除”）
- 禁用鼠标，全程只用键盘完成一次完整操作流程（打开→选择→提交→反馈），卡在任何一步都算失败
重建聚焦顺序不是调几个 tabindex 值的事，而是让结构、语义、样式、脚本四者对齐。最容易被忽略的是：视觉上“放下面”的按钮，如果 DOM 还在上面，键盘用户永远先碰到它——哪怕你写了 tabindex="999"。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
