如何查询溢出:滚动隐藏区域中的元素

Question

是否可以查询具有overflow:scroll的父元素的"隐藏区域"中的所有对象？

有一个带有style="overflow:scroll;height:200px"的父<div>容器。此容器包含一个表。请参阅示例代码：

<div id="scrollContainer" style="overflow:hidden;height:200px">
<table>
<tr>
<td>...</td>
<tr>
<tr>
<td>...</td>
<tr>
...
...
</table>
</div>

如何获取所有不可见<tr>的列表？

Answer 1

第一个问题：

是的，它是。JS并不关心一个元素是否可见，它关心元素是否在DOM中。

因此，无论当前在屏幕上是否可见，document.getElementsByTagName('tr');都将返回所有<tr>。

第二个问题(？

如果重点是特别选择在这个特定时刻屏幕上可见(或不可见(的元素，则可以使用此处所述的.getBoundingClientRect();。

或者，如果您非常关心这些元素的可见性并经常检查它，那么制作类似于轮播或其他"受控"元素的东西可能是个更好的主意。

通过这种方式，您将能够跟踪其状态并准确了解每个元素的可见性。