有没有一种快速的方法可以从类或类型的所有元素中删除选项卡焦点？答案

【问题标题】：Is there a quick way to remove tab focus from all elements of a class or a type?有没有一种快速的方法可以从类或类型的所有元素中删除选项卡焦点？
【发布时间】：2021-01-09 23:58:04
【问题描述】：

假设我有 2 个按钮，一个输入和一个文本区域，我知道如何设置 tabindex="-1" 以防止分别为每个按钮设置标签。

有没有一种快速的方法可以防止我正文中的所有按钮获得标签焦点，或者一个类的所有元素（例如“foo”类的所有元素）？

我也愿意接受 js 的建议。

<html>
<body>
<button>BUTTON 1</button><button class="foo">BUTTON 2</button>
<input class="foo">
<textarea></textarea>
</body>
</html>

【问题讨论】：

有些人遇到了similar problem 您可以修改 jquery 解决方案以遍历所有要禁用选项卡的元素。

标签： javascript html css

【解决方案1】：

以编程方式设置tabindex="-1" 怎么样？

var unfocusableElems = document.querySelectorAll('button, input, textarea, .foo');
unfocusableElems.forEach(function (el) { el.setAttribute('tabindex', '-1'); });

<html>
<body>
<button>BUTTON 1</button><button class="foo">BUTTON 2</button>
<input class="foo">
<textarea></textarea>
</body>
</html>

【讨论】：