如何改进此Javascript，以便将事件附加到页面中的所有元素？

我正在开发一个web应用程序，我需要捕获所有元素的所有事件，我自己编写代码，但我需要你们可爱的专家尽可能地提高我的代码的性能

// Create mouse event callbacks and an array to store callbacks,
// This array is to prevent creation of callback functions multiple times
var mouseEventCallbacks = {};
var mouseEvents = [
    'mouseover', 
    'mouseout', 
    'mousedown', 
    'mouseup', 
    'click', 
    'mousemove', 
    'contextmenu', 
    'dblclick', 
    'mousewheel'
];

function mouseEventCallback(eventType){
    if(!mouseEventCallbacks[eventType])
        mouseEventCallbacks[eventType] = function(event) {
            self.port.emit('new-event', {
                x: event.pageX + window.pageXOffset, 
                y: event.pageY + window.pageYOffset
            },{
                type: eventType
            });
        }

    return mouseEventCallbacks[eventType];
}

// Attach all events to all elements
var elems = window.document.querySelectorAll('*');

for(var j = 0, s = elems.length; j < s; j++) {
    attachMouseEvents(elems[j]);
}

function attachMouseEvents(element){
    for(var k = 0, s = mouseEvents.length; k < s; k++){
        element.addEventListener(mouseEvents[k],
                                 mouseEventCallback(mouseEvents[k]),
                                 false);
    }
}

//创建鼠标事件回调和存储回调的数组，
//此数组用于防止多次创建回调函数
var mouseEventCallbacks={}；
var mouseEvents=[
“鼠标悬停”，
“老鼠屎”，
“mousedown”，
“老鼠”，
“点击”，
“mousemove”，
“上下文菜单”，
“dblclick”，
“鼠标轮”
];
函数mouseEventCallback（eventType）{
如果（！mouseEventCallbacks[eventType]）
mouseEventCallbacks[eventType]=函数（事件）{
self.port.emit（'new-event'{
x:event.pageX+window.pageXOffset，
y:event.pageY+window.pageYOffset
},{
类型：eventType
});
}
返回mouseEventCallbacks[eventType]；
}
//将所有事件附加到所有元素
var elems=window.document.querySelectorAll（'*'）；
对于（var j=0，s=elems.length；j

使用。当事件被触发时，它在DOM中一直到主体（或处理事件的第一个元素），所以您可以在主体的事件处理程序中处理所有事件。然后是

event.target

属性，该属性引用了实际触发它的DOM元素

---

另外，我已经链接了jQuery文档，但这是一般性的建议，不仅仅是关于使用jQuery

您可以使用jQuery，并使用jQuery通用选择器将事件绑定到所有元素，但是jQuery*选择器速度非常慢，而且事件委派优先于.bind

$("*").bind(events...)

《JavaScript：明确指南》的作者David Flangan说：

处理事件的困难之一是IE（直到IE9）实现了与所有其他浏览器不同的事件API。为了解决这个困难，jQuery定义了一个在所有浏览器中都能工作的统一事件API。在其简单的形式中，jQueryAPI比标准或IE事件API更易于使用。在更复杂的全功能形式中，jQuery API比标准API更强大。”

---

for（mouseEvents中的var k）

是迭代数组的错误方法。使用

for（var i=0；i

取而代之。谢谢，我已经编辑了我的问题代码。我不认为它更快，因为jquery可能有一些我不需要的内部重载。绝对是我要说的-事实上，前几天我确实说了一些类似于同事的话，他注意到某些事件，如

“滚动“

在具有溢出内容的div上不要向上传播。所以，要注意这一点。否则，此方法应该比将同一侦听器附加到每个节点更有效。事件委派比事件绑定快吗？如果是这样的话，为什么它会更快呢？当我们谈到数千个元素时，它会快得多——它在绑定时节省内存和CPU时间（在您的代码中，您将迭代数千个元素，内部循环是9次迭代以附加处理程序）。网上有很多测试和文章，只需搜索“javascript bind vs delegation”@AramAlipoor Event delegation通常更快，因为将事件处理程序绑定到一个元素比将其绑定到多个元素要快。但这可能会使浏览器的响应性稍差（因此主观上会变慢），因为每次生成事件时都会检查选择器匹配。有没有办法错过事件？我的意思是，如果第一个事件处理程序调用

stopPropagation（）

，我还可以使用事件委派了解事件吗？这比我的代码快吗？因为我认为jquery有一些我不需要的内部处理。这取决于，阅读本文，它显示了jquery事件处理程序之间的差异。