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

Question

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

我尝试了类似的东西

var el = document.elementFromPoint(x, y)

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

Answer 1

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

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

小提琴

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');