js 判断控件获得焦点的示例代码

在JavaScript中，判断一个控件（如HTML元素）是否获得焦点，通常可以通过检查该元素的`document.activeElement`属性来实现。`document.activeElement`会返回当前文档中获得焦点的元素。下面是一个示例代码，展示了如何判断一个特定的控件（这里以``元素为例）是否获得了焦点：

// 假设我们有一个input元素，其id为"myInput"
var myInput = document.getElementById("myInput");

// 定义一个函数来判断该元素是否获得焦点
function isFocused(element) {
    return document.activeElement === element;
}

// 示例用法
console.log(isFocused(myInput)); // 这将返回true或false，取决于myInput元素是否当前获得了焦点

// 另外，你也可以直接在需要的时候调用这个函数，或者将其绑定到某个事件监听器上，以便在焦点状态改变时执行一些操作

// 示例：当控件获得或失去焦点时打印消息
myInput.addEventListener('focus', function() {
    console.log('Input is focused!');
});

myInput.addEventListener('blur', function() {
    console.log('Input is blurred!');
});

这段代码首先通过`document.getElementById`获取了一个ID为`myInput`的控件。然后定义了一个`isFocused`函数，该函数接受一个元素作为参数，并返回该元素是否等于`document.activeElement`，即是否获得了焦点。最后，展示了如何将这个函数与`focus`和`blur`事件监听器结合使用，以便在控件获得或失去焦点时执行相应的操作。