tabIndex - Javascript

tabIndex 是 Javascript 中一个用于指定 HTML 元素的 tab 键顺序的属性。当用户在按下 tab 键时，浏览器会按照 tabIndex 属性值从小到大的顺序来遍历 HTML 页面中的元素。

用法

const element = document.getElementById('myElement');
element.tabIndex = 1;

tabIndex 属性可设置为任意整数值。其中值为 0 表示元素是可聚焦的，但其顺序不会被 tab 键影响，不会参与到 tab 键的遍历中。而负值则表示元素无法通过 tab 键聚焦。

优点

使用 tabIndex 属性，我们可以为网页的各个元素指定 tab 键顺序，从而提高网页的可访问性和操作性，使得熟练使用键盘的用户可以更快速地完成页面的操作。

示例

<div tabIndex="1">First element</div>
<div tabIndex="2">Second element</div>
<div tabIndex="0">Non-tab focusable element</div>
<button>Normal button</button>

在上述示例中，第一个和第二个 div 元素的 tabIndex 值分别为 1 和 2，因此它们在按下 tab 键时会依次被聚焦，而第三个 div 元素的 tabIndex 值为 0，不会参与聚焦。而最后的 button 元素没有指定 tabIndex 值，因此会在页面最后被聚焦。