JavaScript DOM总结（文档事件）_document 事件-CSDN博客

属性	描述
onblur	当窗口失去焦点时运行脚本。
onfocus	当窗口获得焦点时运行脚本。
onload	当文档加载之后运行脚本。
onresize	当调整窗口大小时运行脚本。
onstorage	当 Web Storage 区域更新时（存储空间中的数据发生变化时）运行脚本。

案例：

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
</head>

<body>
    <script>
        // 01 当窗口失去焦点时，输出 " 窗口失去焦点 "
        window.onblur = function () {
            console.log("窗口失去焦点");
        };

        // 02 当窗口获取焦点时，输出 “ 窗口获取焦点 ”
        window.onfocus = function () {
            console.log("窗口获取焦点");
        };

        // 03 当页面文档加载完成后，输出"Hello, World"
        window.onload = function () {
            console.log("Hello,World");
        };

        // 04 当调整窗口大小时，输出"窗口大小正在改变"
        window.onresize = function () {
            console.log("窗口大小正在改变");
        };

        // 当 Web Storage 区域更新时（存储空间中的数据发生变化时）运行脚本
        window.onstorage = function () {
            console.log("区域更新");
        };
    </script>
</body>

</html>

3、表单事件

表单事件在HTML表单中触发 (适用于所有 HTML 元素，但该HTML元素需在form表单内)：

属性	描述
onblur	当元素失去焦点时运行脚本。
onfocus	当元素获得焦点时运行脚本。
onchange	当元素改变时运行脚本。
oninput	当元素获得用户输入时运行脚本。
oninvalid	当元素无效时运行脚本。
onselect	当选取元素时运行脚本。
onsubmit