为什么document.body事件处理程序中的'this'关键字引用全局窗口对象？

Question

为什么document.body事件处理程序中的'this'关键字引用全局窗口对象？

<!DOCTYPE html>
<html>
<head>
    <style type="text/css">
        body {
            height: 1000px;
        }
    </style>
    <title>Scroll</title>
</head>
<body>
    <button id="btn">click</button>
    <script type="text/javascript">
        document.body.onscroll = function() {
            alert(this);// displays [object Window], instead of [object HTMLBodyElement]
        };

        document.getElementById('btn').onclick = function() {
            alert(this);// displays [object HTMLButtonElement]
        }
    </script>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

我将this关键字放在按钮元素事件处理程序和body元素的另一个处理程序中，但是第二个this关键字引用了全局窗口对象。为什么？

Answer 1

ZER*_*ER0 4

这是因为该body元素将 Window 对象的许多事件处理程序公开为事件处理程序内容属性。

目前此类事件有：blur、error、focus、load和resize。scroll

该列表被称为“窗口反映主体元素事件处理程序集”。

（例如，请参见：https ://html.spec.whatwg.org/dev/webappapis.html ）

归档时间：	6 年，1 月前
查看次数：	57 次
最近记录：	6 年，1 月前