CSS

tabindex

https://developer.mozilla.org/zh-CN/docs/Web/HTML/Global_attributes/tabindex

• tabindex=负值 (通常是 tabindex=“-1”)，表示元素是可聚焦的，但是不能通过键盘导航来访问到该元素，用 JS 做页面小组件内部键盘导航的时候非常有用。
• tabindex=”0” ，表示元素是可聚焦的，并且可以通过键盘导航来聚焦到该元素，它的相对顺序是当前处于的 DOM 结构来决定的。

• tabindex=正值，表示元素是可聚焦的，并且可以通过键盘导航来访问到该元素；它的相对顺序按照tabindex 的数值递增而滞后获焦。如果多个元素拥有相同的 tabindex，它们的相对顺序按照他们在当前 DOM 中的先后顺序决定。

  tabindex的作用

• 元素是否能聚焦：通过键盘这类输入设备，或者通过 focus 方法

• 元素什么时候能聚焦：在用户通过键盘与页面交互时

就是当用户使用键盘时，tabindex 用来定位 html 元素,即使用 tab 键时焦点的顺序。

设置 tabindex=”0” 可以让按 tab 键时，可以聚焦到当前元素，如果有需要聚焦某个 div，或需要能够聚焦到某一块，进行键盘操作时（聚焦到某个滚动块，用键盘进行滚动）。设置 tabindex 0 比较方便。
tabindex=”-1” 只是让某个元素可以被js的 focus 聚焦，并不能被 tab 键聚焦（比较常见的场景就是浮窗导航，可以通过js触发继而聚焦）。
tabindex > 0 相当于tab聚焦优先级，越大越早聚焦。