accesskey 属性用于设置 HTML 元素的键盘快捷键，但仅将焦点移至元素，需再按 Enter 或空格触发操作；因兼容性差、易冲突、移动端不支持等原因，不建议作为核心交互手段。
HTML 元素的快捷键主要通过 accesskey 属性设置，但它不是“按下就执行操作”的热键，而是帮助键盘用户快速将焦点移到目标元素上——后续还需按 Enter 或空格才能触发（如点击按钮、输入文字）。实际项目中它可靠性低，不建议作为核心交互手段。
accesskey 的基本写法和触发方式
给支持的语义化元素添加 accesskey 属性即可：
<button accesskey="s">保存</button><a href="#main" accesskey="m">跳转到主内容</a>-
<label for="search" accesskey="s">搜索</label><input type="text" id="search">（推荐搭配 label，体验更自然）
用户需配合平台特定组合键触发焦点：
- Windows/Linux：Alt + 对应字符（如 Alt+S）
- macOS：Ctrl + Option + 字符（Safari 还需再按 Enter 才激活）
- 值不区分大小写，但必须是单个可打印字符（字母优先，避免数字或符号）
为什么它常“失灵”或不被使用
accesskey 在真实场景中容易失效，主要原因包括：
立即学习“前端免费学习笔记（深入）”；
- 系统或浏览器已占用该组合键（如 Alt+F 打开菜单、Ctrl+S 保存页面）
- 不同浏览器触发逻辑不一致（Firefox 要 Alt+Shift+S，Chrome 只要 Alt+S）
- 屏幕阅读器可能忽略或重映射，导致辅助技术用户行为不一致
- 移动端 Safari 完全不支持，iOS 和 Android 均无响应
- 用户根本不知道快捷键存在，缺乏可见提示
如果非要使用，至少做到三点
降低风险、提升可用性，需主动设计：
- 选冷门字符：避开 a、f、e、h、s、t 等高频系统键，优先用 z、x、q 或数字 1–9
- 加视觉提示：用 CSS 或 HTML 显示快捷键标识，例如
button::after { content: " (Alt+" attr(accesskey) ")"; } - 只用于语义明确的交互元素：
<button>、<a>、<input>、<label>；不要加在<div>上
更靠谱的替代方案
真正提升效率和可访问性，应依赖成熟机制：
- 确保所有可操作元素能被 Tab 键顺序聚焦，且
tabindex设置合理（避免手动设为 1、2、3） - 关键按钮默认响应 Enter/Space，自定义组件用 JavaScript 监听
keydown并判断event.key === 'Enter'或' ' - 需要全局热键时，用
document.addEventListener('keydown', handler)，但务必排除输入框等编辑状态：!event.target.matches('input, textarea, [contenteditable]') - 提供「跳转到主内容」链接（
<a href="#main">跳过导航</a>+<main id="main">），这是 WCAG 强烈推荐的基础能力
