Question

如何从<div>中获得<iframe>？

Answer 1

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

你可以更简单地写一下：

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

将返回第一个有效的内部文档。

获得内部文档后，您可以像访问当前页面上的任何元素一样访问其内部。（innerDoc.getElementById ...等）。

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

Answer 2

加载后，不要忘记访问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>

Answer 3

window.parent.document.getElementById("framekit").contentWindow.CallYourFunction('pass your value')

CallYourFunction()是页面内部的功能，以及该功能操作

Answer 4

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

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

这里的技巧是jQuery的.contents()方法，不像.children()只能获取HTML元素，.contents()可以同时获取文本节点和HTML元素。这就是为什么人们可以通过使用它来获取iframe的文档内容。

进一步阅读jQuery .contents()：.contents()

注意 iframe和页面必须位于同一个域中。

Answer 5

其他答案都没有对我有用。我最终在我的iframe中创建了一个函数，它返回我正在寻找的对象：

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

然后你调用那个函数来检索元素：

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

Answer 6

如果iframe不在同一域中，因此您无法从父级访问其内部，但是可以修改iframe的源代码，则可以修改iframe所显示的页面以将消息发送到父级窗口，这使您可以在页面之间共享信息。一些来源：

Answer 7

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

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');

注意：请记住，页面上的每个iframe都必须具有相同的来源，否则此函数将引发错误。

Answer 8

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

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

从iFrame中获取元素

8 个答案: