相关疑难解决方法(0)

问题:我需要的任何数量的事件处理程序(,DOM节点绑定到任意数量的元素window,document),在动态运行时,我需要能够更新事件我的网页的生命周期中动态创建(或损坏)节点结合.我可以看到有三个选项来解决这个问题:

I)事件委托window
II)每个节点上的直接事件绑定
III)共同祖先的事件委托(直到运行时才会知道,并且可能需要在更改DOM时重新计算)

这样做最有效的方法是什么？

一点背景

我正在开发一组需要对用户事件进行分析跟踪(点击,滚动等)的页面,我希望能够在一堆页面上轻松配置这些事件处理程序,而无需编写脚本来处理事件每个实例的绑定.此外,因为我可能需要在将来跟踪新事件,或者跟踪动态添加到页面/从页面中删除的元素上的事件,我需要能够考虑在生命周期中发生的DOM中的更改的页面.

作为我正在考虑的例子,我想创建一个接受配置对象的函数,该对象允许程序员为每个事件指定默认处理程序,并允许它们为特定元素覆盖它们:

Analytics.init({
    // default handlers for each event type
    defaultHandlers: {
        "click": function(e) { ... },
        "focus": function(e) { ... }
    },

    // elements to listen to 
    targetElements: {

        // it should work with non-DOM nodes like 'window' and 'document'
        window: {
            // events for which the default handlers should be called
            useDefaultHandlers: ['click'],

            // custom handler
            "scroll": function(e) { ... }
        },

        // it should work …

我使用委托机制查找了性能提升的线程.我说的是简单的javascript,没有jQuery或其他工具/库.

每个元素都会在DOM树中生成事件,并通过冒泡机制遍历整个事件.

委托避免为每个元素创建事件处理程序,但在单个处理程序中捕获更多事件.此外,停止冒泡,处理程序可以避免事件进一步传播,如果已经正确处理.因此,它将减少页面的资源消耗.

但是,如果没有停止冒泡,事件会产生并传播通过所有DOM树,因此使用委托或不使用委托在页面中存在相同的资源消耗.而且,如果委托的处理程序必须检查事件的来源,那么它也会更加消耗......

那么,使用委托的性能提升在哪里,除了编程更容易,更简单,更干净？

有一种方法可以避免某些事件产生,或者某些元素产生某些事件,从而节省了很多资源使用？例如,鼠标悬停的简单文本会在正常页面中生成许多无用的消息; 如果不处理该消息,是否可以防止在源处生成该消息？