<分区>
标签 javascript jquery html css
<分区>
我正在编写一个网站，在该网站上滚动时会自动加载新内容(如 Facebook 墙)。每个内容项都有一张图片，同一页面上什至可以有 1000 多张图片。为了提高性能，我想将 display:none 添加到视口(viewport)外的图像中。我无法将内容分页!
我已经写好了剧本。当用户到达底部时加载 X 个新元素。
我的问题是在处理 60 多张图片后，浏览器变得迟钝。
最佳答案
要回答您的实际问题，您可以循环遍历所有元素的位置，以确定它们是否在基于滚动位置的当前视口(viewport)内。
唯一的问题是你需要循环遍历 DOM 树以确定其实际位置，如果你有 100 多张图片，则对每张图片执行此操作会消耗更多内存，然后将 100 多张留在那里。
我理解这种担忧，但除非您遇到实际的性能问题，否则我会保留它。
关于javascript - 如何隐藏视口(viewport)之外的图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9808465/