【问题标题】:speeding up multiple onmouseover events in IE加快 IE 中的多个鼠标悬停事件
【发布时间】:2010-10-14 14:31:50
【问题描述】:

我有一个包含许多(最多 100 多个)html 元素的网页。每个都注册了一个 onmouseover 事件来触发执行一些逻辑和渲染,具体取决于悬停在哪个元素上。

我发现在 IE 中,regitered 的 onmouseover 事件越多,它们触发的时间就越长。在 Firefox 中速度很好,在 Chrome 中更快!

有没有人知道这个问题的解决方案。我想也许注册一个 onmousemove 事件并尝试从坐标中检索 DOM 元素,但我不确定如何执行此操作,或者它是否只是解决问题的一种手段。

【问题讨论】:

  • 请提供示例代码。 100 个元素并不多(即使对于 IE)。可以优化的可能是“一些逻辑”,而不是事件绑定。
  • 如果您告诉我们您要通过事件处理来完成什么,也许有人可以提供更有效的解决方案。

标签: javascript html events dom browser


【解决方案1】:

将 onmouseover 或 mousemove(我认为这两个气泡,不记得)事件附加到正文,当您将鼠标悬停在实际元素上时,您可以处理您需要做的事情,因为它会冒泡到正文您可以在其中处理实际鼠标悬停的元素。您可以使用该元素的自定义属性或扩展属性来处理您需要在鼠标悬停时为特定元素执行的操作。

您真的应该只在需要时附加事件,在不再需要时分离它们。在琐碎的页面上,这可能不是必需的,但在像您这样的场景中,它将提高客户端性能。当我们在一个页面上有数千个表单元素时,我们曾经在我工作的地方做这样的事情。

我的两分钱, 尼基特

【讨论】:

  • 听起来不错,但我如何确定我悬停在哪个元素上?我需要做一些逻辑,并根据基于其在 DOM 中的位置的一些逻辑突出显示悬停的元素
  • 您实际悬停的元素可以从 IE 实现 event.srcElement 或所有其他浏览器事件的目标属性中提取。然而,使用像 jQuery 这样的 JS 框架来避免跨浏览器分叉可能更有意义。希望对您有所帮助。
  • 效果很好,但还是有点慢。正如其他人所期望的那样,我认为我还有其他一些瓶颈。干杯
  • 如果您发布一个似乎是您的瓶颈的代码示例,也许我自己或其他人可以帮助您找出问题所在。干杯。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2018-08-13
  • 1970-01-01
  • 1970-01-01
  • 2023-03-14
  • 2020-06-25
  • 2011-11-09
  • 2011-08-17
相关资源
最近更新 更多