仅更新可见的DOM元素?

时间:2011-12-28 20:41:27

标签: javascript jquery performance dom

我有一个非常繁忙的用户界面,很多不断更新而没有交互(想象一个长的股票报价单或投资组合)的DOM,我开始看到它放慢速度,特别是在IE中。它确实显示了JavaScript引擎的差异。虽然我正在努力遵循jQuery选择器,DOM操作等所有最佳实践,但我认为我可以做得更多。

我想只更新可见的UI部分。所以我想以某种方式只更新用户视口内的DOM元素,当用户滚动时,直到滚动停止,我才想对可视DOM元素进行更新。

这类似于页面上有大量图像时使用的方法,并且只有当图像滚动到视图中时才加载它们。 这听起来像一个复杂的目标,但如果之前已经完成,那就很好奇。我甚至不确定它是否可能。

2 个答案:

答案 0 :(得分:2)

这是另一个非常相似的问题......

Check if element is visible after scrolling

希望这有帮助。

答案 1 :(得分:2)

是的,绝对有可能。您将希望将onScroll事件侦听器与遍历DOM的方法结合使用,并快速解除视口中不存在的任何元素。有多种方法可以检查DOM是否在视图中。我在这个答案中详细介绍了我遇到的最好的一个:

Check if element is visible after scrolling