如何减少JavaScript事件

Question

我需要减少Web应用程序页面上的javascript事件的数量。 将它们迁移到HTML元素上的onclick属性会更好吗？

例如

 <input ... onclick="myJavascript"/> 

相对于

 YAHOO.util.Event.addListener(element, 'click', handleElementClick, eventObject);

问题是Javascript事件是我在Javascript Profiler中看到的最占用资源的代码（我已经使用了Developer工具和Firebug）。 我想减少负载，我想知道这样做的最佳方法是什么。

Answer 1

更好的解决方案是使用事件委派，该事件委派一个事件。 您只需要嗅探元素即可确定是否需要采取行动。 这被认为是改善javascript事件的性能并且不污染DOM的最佳方法。 这种方法也适用于使用Ajax添加到页面的DOM元素，这意味着您无需将事件重新绑定到新元素：

document.onclick = function(e) {
    var event = e || window.event;
    var target = event.target || event.srcElement;

    if (target === myElement) {
        // do something here


}

Answer 2

一般来说，您应该将事件代码保留在JavaScript代码中，而不是将其放入HTML中。 这样可以使将来的调试更加容易，因为它将所有不同的逻辑部分保留在单独的位置。 通常认为在HTML中具有所有结构，在CSS中具有所有表示形式以及在JavaScript中具有所有客户端功能是合乎需要的。 混合不同的层并不一定很糟糕，通常只是不必要的复杂性。

但是，从一般意义上讲，最好的方法是委托方法，该方法是在我可以键入它之前发布的。

Answer 3

如果您想附加多个处理程序，我认为第二种方法更好，并且有更多选项，取决于您使用的框架