什么是最快速响应的方式使Javascript函数调用listener / keypress

Question

在浏览器中使用Javascript创建轻量级游戏时，用户可以使用键盘移动/等等，我想知道使用之间是否存在功能差异：

onkeydown="someFunction();"

和使用：

addEventListener('keypress', function(e) { e.foo(); });

使用one阻止默认按钮行为并使用另一个响应似乎很有用，所以我想知道是否提供了性能改进，例如响应速度，排队顺序点击，不太可能产生错误，或其他我不知道的不可预见的好处

Answer 1

一般来说，一个只是另一个的别名。 on*="jsFunc()"只是调用浏览器为您附加事件的本机方法。

然而，值得注意的是，尽可能保持两者（标记和javascript）分离几乎总是更好。考虑到这一点，坚持在<script></script>标签中绑定事件，并为UI元素保留HTML。

Answer 2

这里的区别在于你只使用第一种方法将一个函数绑定到onkeydown，而你可以使用第二种方法将多个函数绑定到onkeydown。

Answer 3

首先，keydown和keypress之间存在差异。

来自Quirksmode：

<强> KEYDOWN 用户按下某个键时触发。当用户按下键时，它会重复。

<强>按键 在插入实际字符时触发，例如，文本输入。当用户按下键时，它会重复。

因此，alt或ctrl等特殊密钥不会触发keypress个事件，但会触发keydown个事件。

假设事件是相同的，那么它们在功能上是等价的，因为文档中的每个HTML元素都在DOM中表示。

将事件作为属性（object.addEventListener ...）而非作为属性附加的两个主要好处是：

1. JavaScript和HTML的分离。想象一下，如果处理程序更复杂 - 你的HTML中会有一个巨大的字符串。

2. 您可以使用JavaScript动态修改HTML对象的事件属性。也许你想在一些用户操作后替换一个监听器？好吧，你只能用HTML事件属性来实现这一点，因为那是静态的。

Answer 4

定义onkeydown或一般onSomeEvent正在设置显式属性，因此您只能设置一次。

绑定事件处理程序允许您将许多侦听器附加到同一事件。