是否可以仅提取可滚动div的可见内容？

Question

我有<div> overflow: auto;且内容足以要求垂直滚动。

有没有办法，使用PLAIN JAVASCRIPT，只提取<div>中的可见内容（HTML）？ （也就是说，根据当前的scollbar位置，只有屏幕上的可见内容）。注意 - 容器不必是<div>。

Answer 1

是的，这是可能的，但使用

非常hacky

document.elementFromPoint(x,y)

因此，您将遍历div查询屏幕缓冲区的边界框，并收集返回的元素。

有关更详细的API文档，请参阅http://developer.mozilla.org/En/DOM:document.elementFromPoint

Answer 2

当然，只要您不介意将一些position应用于您的容器。一旦您应用了定位，您就可以获得相对于其父元素offset（和height，如果需要）的子元素的width，然后确定元素是否是可见的。

这是一个简单的小提琴我只在Chrome中测试，所以使用风险自负！ ;）

http://jsfiddle.net/7nz1kfyx/

相关的JS：

function isElementVisible (el, parent) {
    return (el.offsetTop + el.clientHeight) <= (parent.clientHeight);
}

您可以为返回的条件添加其他逻辑（例如，检查相对于其父级的元素的offsetLeft，看它是否实际可见...）

希望这有帮助！