HTML - DOM Document 的 hasFocus() 方法

**hasFocus()** 方法用于确定文档或文档内任何元素是否具有焦点。它返回一个布尔值，其中 true 表示文档/元素具有焦点，false 表示否则。它表示活动元素是否处于焦点状态。

语法

document.hasFocus();

参数

此方法不接受任何参数。

返回值

它返回一个布尔值，表示元素或文档是否具有焦点。

HTML DOM Document 'hasFocus()' 方法示例

以下示例说明了 hasFocus() 方法。

检查文档焦点

以下示例显示 HTML 文档是否具有焦点。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document hasFocus() Method
    </title>
</head>
<body>
    <p>
        Click the button below to check if 
        document is in focus or not.
    </p>
    <button onclick="fun()">
        Click me
    </button>
    <p id="focus"></p>
    <script>
        setInterval("checkFocus()", 1);
        function fun() {
            let x = document.getElementById("focus");
            if (document.hasFocus()) {
                x.innerHTML = "FOCUSED";
            }
            else {
                x.innerHTML = "NOT FOCUSED";
            }
        }
    </script>
</body>
</html>

更改文本颜色

在以下示例中，如果文档具有焦点，则文档的文本颜色会发生变化。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document hasFocus() Method
    </title>
</head>
<body>
    <p>
        Click the button below to check 
        if document is in focus or not.
    </p>
    <button onclick="fun()">
        Click me
    </button>
    <p id="focus">Welcome to Tutorials Point...</p>
    <script>
        setInterval("checkFocus()", 1);
        function fun() {
            let x = document.getElementById("focus");
            if (document.hasFocus()) {
                x.style.color = "#04af2f";
            }
            else {
                x.style.color = "yellow";
            }
        }
    </script>
</body>
</html>

支持的浏览器

方法
hasFocus()	是 2	是 12	是 3	是 4	是 15

html_dom_document_reference.htm

打印页面