Javascript 从iFrame中获取BoundingClientRect

我有一个函数来评估某个元素（iFrame）是否在视口中，如果该元素在视图中，则返回true

function isElementInViewport() {
    var el = document.getElementById('postbid_if')
    var rect = el.getBoundingClientRect();
    var elemTop = rect.top;
    var elemBottom = rect.bottom;

    console.log("eleTom " + elemTop)
    console.log("elemBottom " + elemBottom)
    console.log("window.innerHeight " + (window.innerHeight + (window.top.innerHeight * 0.5)))

    var isVisible = (elemTop >= 0) && (elemBottom <= (window.innerHeight + window.innerHeight * 0.5));
    return isVisible;
}

函数IsElementViewport（）{
var el=document.getElementById（'postbid\u if'）
var rect=el.getBoundingClientRect（）；
var elemTop=rect.top；
var elemBottom=矩形底部；
console.log（“eleTom”+elemTop）
控制台日志（“elemBottom”+elemBottom）
console.log（“window.innerHeight”+（window.innerHeight+（window.top.innerHeight*0.5）））
var isVisible=（elemTop>=0）和&（elemBottom每个iframe都有自己的作用域，因此iframe中的窗口不同于根窗口

您可以通过
window.top
获得根窗口，利用这些知识，您可以计算当前iframe的绝对位置。下面是一个适当的函数：

function currentFrameAbsolutePosition() {
  let currentWindow = window;
  let currentParentWindow;
  let positions = [];
  let rect;

  while (currentWindow !== window.top) {
    currentParentWindow = currentWindow.parent;
    for (let idx = 0; idx < currentParentWindow.frames.length; idx++)
      if (currentParentWindow.frames[idx] === currentWindow) {
        for (let frameElement of currentParentWindow.document.getElementsByTagName('iframe')) {
          if (frameElement.contentWindow === currentWindow) {
            rect = frameElement.getBoundingClientRect();
            positions.push({x: rect.x, y: rect.y});
          }
        }
        currentWindow = currentParentWindow;
        break;
      }
  }
  return positions.reduce((accumulator, currentValue) => {
    return {
      x: accumulator.x + currentValue.x,
      y: accumulator.y + currentValue.y
    };
  }, { x: 0, y: 0 });
}

到

这应该是可行的。
ofc，这不包括安全帧，因为您无法访问父窗口是的，这是真的。并且没有其他可能做到这一点。
var elemTop = rect.top;
var elemBottom = rect.bottom;

var currentFramePosition = getCurrentFrameAbsolutePosition();
var elemTop = rect.top + currentFramePosition.y;
var elemBottom = rect.bottom + currentFramePosition.y;