使用JavaScript或jQuery跟踪实际HTML元素的视图（仅与页面加载相对）

Question

我当前的项目需要（如果可能）跟踪JavaScript小部件的实际视图，以便我们可以将此数据与我们的Google Analytics软件报告的总浏览量进行比较/控制（ Clicky 和/或Google Analytics（分析）。

基本上，我们将此小部件出售给客户，并希望能够提供可靠的指标来展示小部件在产生客户兴趣方面的功效。

为此，我们希望能够将点击率报告为总小部件视图的一部分，而不是总页视图（因为我们的假设是很多人查看窗口小部件所在的页面可能实际上看不到它，因为它位于页面底部附近的一长串文章文本下面。）

我的问题是 - 有没有办法可靠地跟踪HTML元素（例如，小部件的容器元素或它所在的容器元素）何时进入浏览器视口？我们希望在窗口小部件出现在浏览器视口中时增加分析统计信息，但是当它刚刚加载到页面上时却不会进入视口。

小部件将加载jQuery，如果这有所不同。谢谢你的帮助！

Answer 1

我不确定这个小部件是如何注入容器页面的。 如果不是通过使用iframe完成但是说<script src="widget-generator-url">那么你的问题已经在如何判断DOM元素在当前视口中是否可见？