时间戳

首页 > 解决方案 > JavaScript 使用 div 类而不是 div id 声明来关注特定元素

javascript - JavaScript 使用 div 类而不是 div id 声明来关注特定元素

问题描述

以下函数可以关注具有 id 声明的元素：

function setFocus() { 
    document.getElementById("focus").focus(); 
}

但是如何才能专注于具有类名声明的元素。用例是否会出现在我们想要关注的元素已经从 dom（即const element = document.querySelectorAll('.a-class-name')[0]）类型的场景中存储的代码中？

标签： javascript

解决方案

元素是否有标签索引？除非它具有选项卡索引，否则您无法聚焦非输入元素。用于tabindex="-1"div 和 span 等元素。然后调用.focus()元素上的方法。-1 将允许您使用 focus 方法进行对焦，但在使用键盘移动焦点并按 Tab 时不会获得焦点。

document.getElementById('btn').addEventListener('click', function() {
  document.querySelectorAll('.focus_me')[0].focus();
});
<span class="focus_me" tabindex="-1">Focus me</span><br>
<button id="btn">Click to focus</button>

推荐阅读