如何更改 iframe 中加载的网站内容？答案

【问题标题】：How to change content of website loaded in iframe?如何更改 iframe 中加载的网站内容？
【发布时间】：2013-09-02 05:39:28
【问题描述】：

我需要使用从其他域加载到 iframe 中的 jQuery 来更改网站的内容，例如：

<html>
  <head>
  </head>
  <body>
    <iframe src="site.com/somepage.html></iframe>
    <script>
      $('iframe').find('div#message').value('hello');
    </script>
  </body>
</html>

我还将目标链接添加到白名单。有什么帮助吗？谢谢。

【问题讨论】：

首先，您可能会被跨域限制阻止。如果您拥有这两个网站并且已经解决了这个问题，那么您的 javascript 可能在 iframe 内容加载之前执行。
是的，我停止了限制，并将其他域添加到白名单以解决该问题。

标签： javascript jquery html iframe whitelist

【解决方案1】：

如果你想获得一个不同域的网站，你必须在你的服务器端使用解析器，它会解析来自网站的 html，然后将解析的 html 回显到你的客户端

【讨论】：

【解决方案2】：

您的脚本在运行时运行，因此它不会找到 iframe 的 DOM 并会中断。您可以做的是在您的父页面上创建一个函数，例如：

//On Your Parent page
function modifyIframeContent() {
     $('iframe').find('div#message').value('hello');
}

然后在加载后从 iframe 调用此函数。

// On Your Iframe page
window.onload = function() {
    parent.modifyIframeContent();
}

当然：您的 iframe 必须与此作品的域相同。

【讨论】：

对不起，我需要在其他域上进行更改

【解决方案3】：

由于跨站点攻击/模拟证券，很长一段时间以来，这在您自己的域不同的大型机浏览器（Chrome、IE、Fire）中是不可能的。

您可以通过代理来实现这一点，我的意思是代理，使用服务器端解决方案，您可以在其中获取“site.com”生成的 HTML 并按原样在您的域中输出。

【讨论】：