tabIndex在大量启动时如何工作

Question

我们说我有一个带标题的复杂页面和许多按钮。 然后在页面下方，我有一个部分，其中DOM中的顺序与它们应该关注的实际顺序不匹配。

我知道我可以添加tabIndex属性，使它们按正确顺序可以按Tab键访问。

但是这会如何影响没有tabIndex的部分上方的按钮和链接？

例如：

<header>
<a></a>
<a></a>
<a></a>
<a></a>
</header>
<div>
<button tabIndex=3 />
<button tabIndex=2 />
<button tabIndex=1 />
</div>

标题中的链接是否可以在按钮之前或之后聚焦？

如果我从10开始而不是1开始怎么办？

有没有办法限制某个DOM元素中tabIndex的顺序，但是否则会与页面的其余部分一起流动？

Answer 1

支持并分配了tabindex的元素首先导航到其他元素，然后导航到其他元素。正如W3 states：

1. 首先导航支持tabindex属性并为其指定正值的元素。导航从具有最低tabindex值的元素继续到具有最高值的元素。值不必是顺序的，也不必以任何特定值开头。具有相同tabindex值的元素应按它们在字符流中出现的顺序进行导航。
2. 接下来导航那些不支持tabindex属性或支持它并为其赋值“0”的元素。这些元素按照它们在字符流中出现的顺序进行导航。
3. 禁用的元素不参与Tab键顺序。

Answer 2

好吧，您可以在该部分的链接上放置tabIndex = -1，因此它们不会处于Tab键顺序中。这样，它们将直接转到指定了tabIndex值的那些。