javascript - Onclick 与 addEventListener

<分区>

我对使用“onclick”“onmousedown”作为 HTML 元素的属性有点困惑。

如:

<button onclick="my_JS_function()"></button>

或

<div onmousedown="my_another_JS_funciton"></div>

但有些人说添加“监听器”的唯一“正确”方法是

document.getElementById("my_id").addEventListener("onclick", my_JS_function, false);

什么是更“合适”、更受支持的方法？

最佳答案

如果您已经知道函数和元素是 html 的一部分，即不是动态添加，那么您添加内联函数而不是使用像“addEventListener”这样的额外方法调用是好的

还有一点要注意

虽然 onclick 适用于所有浏览器，但 addEventListener 不适用于旧版本的 Internet Explorer，它使用 attachEvent。

OnClick 是一个 DOM Level 0 属性。 AddEventListener 是 DOM Level 2 定义的一部分。阅读有关此内容:http://www.w3.org/TR/DOM-Level-2-Events/events.html

作为 HTML 标记属性添加的内联事件处理程序，例如:

 <a href="gothere.htm" onlick="alert('Bye!')">Click me!</a>

上述技术很简单，但有一定的缺点:它们允许每个元素只有一个事件处理程序。此外，使用内联事件处理程序时，JavaScript 代码与 HTML 标记的分离非常差。

document.getElementById("my_id").addEventListener("onclick", my_JS_function, false);

优点:您可以添加多个事件处理程序。还分离了 html 和 javascript 代码

有关更多详细信息，您可以阅读以下内容:Adding an Event Handler

关于javascript - Onclick 与 addEventListener，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14135126/