Javascript 从iFrame中获取元素

如何从

中获取

你可以更简单地写：

var iframe = document.getElementById('iframeId');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;

并返回第一个有效的内部单据

一旦获得了内部文档，就可以像访问当前页面上的任何元素一样访问其内部。（

innerDoc.getElementById

等）

重要提示：确保iframe位于同一个域上，否则无法访问其内部。这将是跨站点脚本编写。

window.parent.document.getElementById（“framekit”）.contentWindow.CallYourFunction（“传递值”）

---

CallYourFunction（）

是页面中的函数，而页面上的函数操作

其他答案都不适用于我。我最终在iframe中创建了一个函数，返回我要查找的对象：

function getElementWithinIframe() {
    return document.getElementById('copy-sheet-form');
}

然后像这样调用该函数以检索元素：

var el = document.getElementById("iframeId").contentWindow.functionNameToCall();

---

加载iframe后不要忘记访问它。没有jQuery的老而可靠的方法：

<iframe src="samedomain.com/page.htm" id="iframe" onload="access()"></iframe>

<script>
function access() {
   var iframe = document.getElementById("iframe");
   var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
   console.log(innerDoc.body);
}
</script>

函数访问（）{
var iframe=document.getElementById（“iframe”）；
var innerDoc=iframe.contentDocument | | iframe.contentWindow.document；
console.log（innerDoc.body）；
}

以上答案使用Javscript提供了很好的解决方案。 下面是一个简单的jQuery解决方案：

$('#iframeId').contents().find('div')

这里的技巧是jQuery的

.contents（）

方法，与只能获取HTML元素的

.children（）

不同，

.contents（）

可以同时获取文本节点和HTML元素。这就是为什么可以通过使用iframe来获取iframe的文档内容

进一步阅读jQuery

.contents（）

：

---

注意iframe和页面必须在同一个域上。

下面的代码将帮助您找到iframe数据

let iframe = document.getElementById('frameId');
let innerDoc = iframe.contentDocument || iframe.contentWindow.document;

---

如果iframe不在同一个域中，因此您无法从父级访问其内部，但您可以修改iframe的源代码，那么您可以修改iframe显示的页面以向父级窗口发送消息，从而允许您在页面之间共享信息。一些资料来源：

---

您可以使用此函数查询页面上的任何元素，无论它是否嵌套在一个iframe（或多个iframe）中：

---

注意：请记住，页面上的每个iFrame都需要具有相同的来源，否则此函数将抛出错误。

回答得很好。您知道您可以这样做吗：var innerDoc=iframe.contentDocument | | iframe.contentWindow.document//更具可读性，意味着sameI已经看到人们被三元运算符所迷惑。他们似乎不知道是否返回了第一个有效的密码。事实上，当我编辑答案以包含它时，我身后的那个家伙问我这有什么用……为了简单起见，可能比使用更复杂的代码更好：）@JellicleCat:任何绕过这一点的方法都是“跨站点请求伪造”，也称为“一键式”攻击或“会话骑行”是指从iFrame调用函数，而不是获取元素的引用。为什么要重复9年前发布的已接受答案中的部分建议？至少删除此答案会为您赢得一个同伴压力徽章…

let iframe = document.getElementById('frameId');
let innerDoc = iframe.contentDocument || iframe.contentWindow.document;

function querySelectorAllInIframes(selector) {
  let elements = [];

  const recurse = (contentWindow = window) => {

    const iframes = contentWindow.document.body.querySelectorAll('iframe');
    iframes.forEach(iframe => recurse(iframe.contentWindow));
    
    elements = elements.concat(contentWindow.document.body.querySelectorAll(selector));
  }

  recurse();

  return elements;
};

querySelectorAllInIframes('#elementToBeFound');