Skip to main content
 首页 » 编程设计

jquery之Chrome 事件触发在大型 DOM 中需要很长时间

2026年07月28日9lhb25

我有一个相对较大的 DOM,并且注意到在元素上触发事件时,chrome 的性能会出现令人难以置信的下降。单个事件例如:

myElem.trigger('myevent.myscope',arguments); 

需要 14 毫秒!! (22.0.1229.92 m)

同一事件在 Firefox 15.0.1 和 msie 9 中触发时间不到 1 毫秒!

该元素是一个 jquery 对象并且已被缓存,因此在触发之前不会发生 DOM 查找。我正在使用 console.time()

console.time('trigger'); 
myElem.trigger('myevent.myscope',arguments); 
console.timeEnd('trigger'); 

有人可以解释一下这种情况吗

谢谢

加里

请您参考如下方法:

这不是对您问题的直接回答。

但根据我在自定义事件方面的经验,我会避免使用触发器/jquery 事件。

取决于 jQuery 版本。触发 dom 树的冒泡,这可能需要相当长的时间。

"As of jQuery 1.3, .trigger()ed events bubble up the DOM tree; an event handler can stop the bubbling by returning false from the handler or calling the .stopPropagation() method on the event object passed into the event. " - trigger

我个人的解决方案是使用 Peter Higgins Pubsub .

我创建了一个 jsperf 测试,显示 jquerys 'on 的性能差异。 ' (蓝色是 pubsub,红色是 jquery,越长越好[每秒操作数]); http://jsperf.com/peter-higgins-pubsub-vs-tiny-pubsub

从现在开始,我在处理自定义事件时使用 pubsub,在处理点击、鼠标悬停等事件时使用 jquery。

只是我的2美分。