Question

如何获得同一域中最顶层的iframe，即

iframe level 1 example.org
    iframe level 2 example.org
    iframe level 2 example.org 
        iframe level 3 example.org <-- should return iframe level 1

iframe level 1 other-example.org
    iframe level 2 example.org
    iframe level 2 example.org 
        iframe level 3 example.org <-- should return iframe level 2

iframe level 1 other-example.org
    iframe level 2 example.org
    iframe level 2 example.org <-- should return iframe level 2 (this)

我需要它，因为我有一个网站应该在另一个域的iframe中工作并且独立。

在这个网站上有一些依赖于window.top的脚本，它不应该是顶层，而是同一域中最顶层的iframe。

Answer 1

如果您尝试访问父级而来自其他域，则会出现错误。您可以使用它来递归尝试访问父级，直到它失败，例如：

function getTopIframe(win) {
  try {
    return getTopIframe(win.parent);
  } catch(e) {
    return win;
  }
}

编辑：

最顶层的窗口是它自己的父窗口，因此如果顶部窗口位于同一个域中，您需要检查它以防止永久循环：

function getTopIframe(win) {
  try {
    if (win.parent != win) {
      return getTopIframe(win.parent);
    }
  } catch(e) {
  }
  return win;
}

Answer 2

Guffa的答案在相反的情况下找不到最顶层的相同域窗口，其中来自不同域的窗口位于两个相同域窗口之间。要处理这种情况，我们需要始终遍历到最顶层的窗口，并分别跟踪来自同一域的窗口。

下面的实现还做了一些其他的好处：（a）它默认使用当前窗口，因此在最常见的情况下可以不带任何参数调用它们，（b）它消除了不必要的尾递归，有利于一个简单的while循环。

function topSameDomainWindow(win) {
  win = win || window;
  var top = win;
  while (win.parent != win) {
    try {
      // Will throw when the parent window is from a different domain
      win.parent.document;
      top = win;
    } catch (e) {}
    win = win.parent;
  }
  return top;
}

同一个域名中最顶层的iframe是什么？

2 个答案:

编辑：