先记住这个答案
给 <input> 加上 autofocus，浏览器会在适当时机把焦点放到它上面，用户无需先点击就能输入。这个属性不是“默认选中”也不是“始终维持焦点”；用户点击其他控件后，焦点照常移动。是否该用它，关键看打开页面时用户的首要任务是否确实是输入。
autofocus是布尔属性- 页面加载或对话框显示时可聚焦
- 多个目标不会同时得到焦点
- 自动聚焦可能触发滚动与读屏跳转
页面加载时会发生什么
浏览器处理页面时会选择符合条件的自动聚焦元素。若目标在页面较下方，视口可能为了显示它而滚动。对于搜索页的主搜索框，这通常符合预期；对文章页顶部的订阅输入框，则可能让用户错过标题和导航。不要给页面各处都标上 autofocus，只有一个焦点位置能生效。
<form action="/search">
<label for="query">搜索内容</label>
<input id="query" name="q" autofocus>
<button type="submit">搜索</button>
</form>这里 label 保证输入有可理解的名称。用户进入搜索页即可打字，但如果页面还要先读一段说明，自动聚焦就可能过早。是否触发移动端虚拟键盘也与设备和浏览器有关，不宜把它当成必然结果。
对话框里怎样使用
对话框打开后，焦点应落在对话框内合适的位置。简单的单字段编辑框可给字段设置 autofocus；如果包含重要说明、危险操作或多个选择，把焦点放在说明或安全默认按钮上往往更合适。关闭对话框后，还应让焦点回到打开它的控件，形成完整的键盘操作路径。
autofocus 不代替焦点管理。动态组件可能反复挂载，页面也可能同时出现多个可聚焦区域；应实际用 Tab、Shift+Tab 和读屏检查，而不是只看鼠标点击是否正常。
还有一个容易在单页应用里踩到的时机问题：autofocus 主要由浏览器在元素插入文档后处理，页面初次加载时若有多个元素都写了它，通常只有文档顺序最先的那个起作用。把输入框放进后来打开的对话框时，焦点应跟随对话框生命周期管理；对话框关闭后还要把焦点还给打开它的按钮，否则键盘用户会突然失去位置。不要把 autofocus 当作跨页面跳转后一定生效的命令。
容易答错的地方
- 把
autofocus理解为持续锁定焦点 - 它只在指定时机请求一次聚焦，之后用户可以正常把焦点移走。
- 给每个输入都加上
autofocus - 多个候选目标不会轮流聚焦，焦点结果还会变得难以维护。
面试官还会怎么问？
页面为什么一打开就滚到中间？
自动聚焦的控件可能在视口外，浏览器为显示焦点而滚动。检查是否有下方控件带 autofocus。
弹窗关闭后焦点应该去哪？
通常回到触发弹窗的按钮，使键盘用户能从原位置继续操作。
可以给普通按钮设置 autofocus 吗？
可以，能获得焦点的相关 HTML 元素并不限于文本输入；仍要判断这个初始焦点是否合理。
参考资料
示例用于理解所注明的运行环境与边界；延伸学习可结合原文中的更多案例。