有没有办法从其中的元素访问 iframe 外部的 Dom？

Question

我们有办法通过 iframe 向下遍历 DOM 到 #btn1 我们可以通过$('#iframe1').contents().find('#iframe2').contents().find('#btn1')来做到这一点

我正在努力将 DOM 从 #btn1 向上移动到 #iframe2 之外

下面的代码给了我[]。将 btnElement 视为 jquery#btn 对象

`btnElement.closest('iframe')`

这都不行

btnElement.parent().parent().parent()

有没有办法从 btn1 访问 iframe2 之外的 Dom？？

注意：所有 iframe 都属于同一个来源。跨起源不是我关心的问题

Answer 1

你不能遍历它，不； jQuery 使用的 DOM 植根于 iframe 的窗口。

但是那个窗口对象有一个parent 属性，它指向父窗口。因此，您可以使用它来访问父窗口中的内容。

如果父窗口也加载了jQuery，可以这样使用：parent.$("selector")。

如果父窗口没有加载 jQuery 但 iframe 加载了，您通常可以像这样在父窗口中查找内容：$(parent.document).find("selector")，但 jQuery 的其他用途可能是松鼠，最好尽可能使用实例从加载它的窗口中获取 jQuery。

（只有当框架和它的父框架从同一个来源加载时，你才能这样做。）

---

你的评论：

唯一给我的就是。 btn1 的 jquery 对象。如何找出它的父 iframe 元素。 ?

我想访问这个 iframe 之外的 DOM 比如说例如我想知道当前 iframe 的父 div

我不相信有任何直接的方法可以做到这一点，不，你必须寻找：jQuery 对象内的按钮元素（例如，btn1[0]）有一个名为ownerDocument 的属性，它将是@987654326 @。 iframe 元素有一个 contentDocument 属性，它指的是同一件事。所以你用parent得到父窗口，然后找到里面所有的iframe，选择有.contentDocument === btn[0].ownerDocument的那个：

var btn1 = $("#btn");
var doc = btn1[0].ownerDocument;
var iframe = $(parent.document).find("iframe").filter(function() {
    return this.contentDocument === doc;
});
if (iframe.length) {
    // We have the `iframe` element. To get its parent, we'd use
    // `iframe.parent()`. Let's give it a green border:
    iframe.parent().css("border", "1px solid green");
}