只更新可见的DOM元素

Update only visible DOM elements?

本文关键字:DOM 元素 更新      更新时间:2023-09-26

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

我只想更新UI中可见的部分。因此,不知何故,我想只更新用户视窗内的DOM元素,当用户滚动时,只有在滚动停止时,我才想对可查看的DOM元素执行更新。

这类似于在页面上有很多图像时使用的方法,只有当图像滚动到视图中时才会加载它们。这听起来像是一个复杂的目标,但我很好奇以前是否有人这样做过。我甚至不确定这是否可能。

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

检查滚动

后元素是否可见

当然有可能。您需要将onScroll事件监听器与遍历DOM的方法结合使用,该方法可以快速删除视图中没有的任何元素。有多种方法可以检查DOM是否在视图中。我所见过的最好的一个详细的答案是:

检查滚动后元素是否可见