Question

我只使用JavaScript，没有jQuery。

<div onclick="doFunction()"></div>
<div onclick="doFunction()"></div>
<div onclick="doFunction()"></div>
<div onclick="doFunction()"></div>
<div onclick="doFunction()"></div>
<div onclick="doFunction()"></div>

VS

document.addEventListener('click', function () {
    //code here
});

Answer 1

与onclick相比，

addEventListner会更快。您可以通过运行测试来查看以下链接以获取性能详细信息。

http://jsperf.com/click-vs-addeventlistener/9

有关使用它们的更多详细信息，请查看以下链接。

addEventListener vs onclick

Answer 2

通过使用“onclick”，您混合的是Javascript和HTML 被认为是一种良好的做法，因为它不可扩展。考虑动态添加，插入，删除示例中的元素。 HTML描述了结构，CSS描述了样式，JavaScript控制了行为。
如果你还没有看过 Event Delegation：事件委托允许您避免将事件侦听器添加到特定节点，而是将eventlistener添加到一个父节点。

因此addEventListener 事件委派将会成为

使用addEventListener或onclick以提高性能是否更有效？

2 个答案: