如何使用Javascript或jQuery从iFrame获取控件

Question

我们正在html页面中加载第三方iframe。 我们正在一个特定的div中加载它。 到此步骤为止，它已成功运行。 但是，接下来我们要查找在iFrame中加载的控件。 另外，iFrame没有任何关联的ID。

由于不存在iFrame ID，因此我们尝试如下所示首先获取iframe

var objiframe = $('#divContainer').find('iframe');

因此，在这里我们获取了iFrame对象，但找不到位于iFrame下的任何控件。

我们尝试了以下几种方法来找到控件

var iFrameDOM = $(objiframe).contents();
var control = $(iFrameDOM).find("#duedate");

var data = objiframe.contentWindow.document.getElementById('duedate');

但是不知何故我们没有得到控件或id。 在大多数情况下，我们会得到“未定义”或“无法读取null的属性'contentWindow'”

任何对此的帮助表示赞赏

Answer 1

如果页面来自不同的域，则应该不能够，浏览器安全沙箱应阻止这种类型的访问。 当两个页面来自同一域的不同子域时，它可能会起作用。

访问子iframe可能会起作用，但是反过来肯定不会起作用。

最简单的方法是通过窗口上的frames对象，如下所示：

window.frames[0].document.getElementById('ElementId').style.backgroundColor="#000";

Answer 2

如果iFrame不在您的其他域上，那么您将受到限制，并且与iframe进行通信的唯一方法是使用Web Messaging API 。

因此，您必须检查iFrame公开了哪些功能。

本文可以帮助您了解第三方iFrame可以做什么或不能做什么。