JS activeElement()方法

最新推荐文章于 2023-11-01 10:43:46 发布

Dcripple

最新推荐文章于 2023-11-01 10:43:46 发布

阅读量2.1k

点赞数

文章标签： js

本文链接：https://blog.csdn.net/weixin_45990765/article/details/116706214

版权

本文介绍了如何使用document.activeElement属性获取当前文档中获得焦点的元素，包括如何设置元素焦点及检查元素是否获取焦点的方法。通过具体示例展示了这些方法的实际应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

document.activeElement()属性返回文档中当前获得焦点的元素

该属性是只读的

例：

<body οnclick="def()">
	<input type="text" value="输入字段">
    <button>按钮</button>
    <p id="demo"></p>

     <script>
           function def() {
                  var a = document.activeElement.tagName;
                  //当前a获得焦点，如果没有焦点元素，会返回body或者null
                  console.log(a);
            }
      </script>
 </body>

为元素设置焦点，使用element.focus()方法

例：

 用户名：<input type="text" id="fc" οnclick="getfocuing()">
 <script>
      function getfocuing() {
           document.getElementById("fc").focus();
      }
 </script>

使用document.hasFocus()方法来查看当前元素是否获取焦点

document.hasFocus()返回的是boolean类型

例：

  <p id="demo"></p>
        <script>
          setInterval("fe()",1);
            function fe() {
                var x = document.getElementById("demo");
                if (document.hasFocus()){
                    x.innerHTML = "文档获得焦点";
                } else{
                    x.innerHTML = "失去焦点";
                }
            }
        </script>