javascript - DOM onclick 处理程序参数/执行上下文

Question

哪些参数会传递给 DOM onclick 处理程序？参数是如何解析的/DOM onclick 处理程序的执行上下文是什么？

查看此jsbin (使用浏览器开发控制台，因为 jsbin 不太好)或下面的代码:

<!-- Remove the id="someid" and see what happpens -->
<input type="text" id="someid" onclick="clickHandler(this,event,someid)'"/>

<script>
   function clickHandler() {
      console.log(arugments);
   }
</script>

引用文献

MDN DOM on-event handlers

其他详细信息

我意识到不建议在 DOM 中附加事件。但这种技术仍在遗留应用程序中使用，我找不到任何超出向处理程序传递“this”参数之外的文档。

Answer 1

这是一个令我困惑的情况，我认为绑定(bind)在 HTML 属性中的处理程序以某种方式具有不同的执行上下文。

处理程序仍然在全局范围/窗口对象中执行。因此，正如预期的那样，函数中的事件对象引用了window.event对象，someid对象引用了window.someid。

<input type='text' id='someid' 
 onclick="
   clickHandler(this,
                event,  //window.event
                someid)" //window.someid'/>

为具有唯一 ID 的元素自动创建窗口对象是我不知道的事情，问题评论中指出了这一点，请参阅:

Do DOM tree elements with ids become global variables?