如何获得当前显示在屏幕上的第一个可见DOM元素？

Question

如何获取当前显示在屏幕上的第一个可见DOM元素？

我试过像

这样的东西

var el = document.elementFromPoint（x，y）

并增加while循环中的y坐标，但问题是当文档上有css多列时它不起作用，在这种情况下＆lt; html＆gt;返回标记，而不是实际元素。有什么方法可以让我真正得到屏幕（顶部，左侧）上适用于css列的元素吗？

Answer 1

这是一个非常基本的示例，只是获取距离top最远的元素。这只是一个开始，因为您可能也想考虑left偏移量。

您需要排除body和html元素（如下所示），因为它们始终是第一个。

Fiddle

var first;
$(':visible').not('body, html').each(function() {
    if (typeof first == 'undefined') {
        first = $(this);
    } else if ($(this).offset().top < first.offset().top) {
        first = $(this);
    }
});
first.addClass('highlight');