Html 将div中的文本从一个iframe提取/回显到页面的另一部分

因此，如果可能的话，我想从自定义页面上的一个iframe中回显或复制一些文本到该iframe所在页面上的另一个部分/div中

例如：

<div 1>
  <iframe> 
    <div inside frame>
       Text i would like to echo/copy
    </div>
  </iframe>
</div>
<div 2>
  (another iframe could go here if needed but i was firstly trying to do it without another one.)
  Text from the iframe above 
</div>

我可能没有100%的权利，但我想这样做，在第二部分，我将有一个类，使文本滚动

这是我正在做的twitch stream项目。这是从页面中获取显示“正在播放”的文本，并通过背景色“chroma key green”使其透明，然后将其显示在流中

另一个选项是，如果我可以使用某种脚本，在这个div更新时将文本发送到文本文件中，然后我可以将文本文件添加到流中

注意：我不介意使用php或java/jquery。最重要的是，我一直在努力使文件易于使用和编辑。我只是想指出，我在java和php方面没有那么丰富的经验。我想用最简单的方法来做。 谢谢

我不想包含我的所有代码，但这很简单，非常感谢所有帮助。

如果父页面和iframe内的页面托管在同一个域中，您可以通过父页面上的类似内容直接访问iframe的内容：

var iframe = document.getElementById('id-of-iframe');
var element = iframe.documentWindow.getElementById('id-of-element-inside-iframe');

出于安全原因，如果页面不是托管在同一个域上，则此操作将失败

如果页面托管在不同的域上，但您可以访问这两个域，那么您可以在这两个页面上更改服务器的HTML输出，您还有另一个选项，称为跨文档消息传递

这有点复杂，需要父页面和子页面上的脚本相互通信并来回发送数据

在父页面上，您将看到如下内容：

window.attachEventListener('onmessage', function (...) {
  // Listen for messages from the child page
}, false);

然后在子页面中，您将打包数据并通过如下调用将其发送给父级：

parent.postMessage(...);

很明显，我在这里遗漏了一些细节…，但这是总体思路

---

如果您不能同时访问父页面和子页面，则无法实现您的要求。允许任何页面访问iframe中的任何其他页面将是一个主要的安全问题。想象一下，如果我在我的站点上放置一个完整的页面iframe，在其中加载Gmail，然后设置一个脚本来监视密码字段的值。

父页面和iframe是否位于同一个域中？如果没有，您是否能够修改iframe页面的源代码以向其添加JavaScript？否，父页面作为标准html文件在本地托管。iframe本身嵌入到父页面中，页面上实际上还有4个其他iframe将其他内容也拉到页面中。但我只需要访问其中一个iframe中的某个div。我可以将java添加到父页面，而不是嵌入的iframe，当然，除非您可以将java添加到嵌入的iframe，正如我指出的，java不太好。谢谢继续。如果有帮助，iframe将链接到nightbot.tv/autodj。我要复制/echo页面上的div有一个id=currentTitle，因此我不确定我是否能够以某种方式获取它。不幸的是，根据您的场景，您所要求的似乎是不可能的。可以理解。尽管我很好奇是否可以从一个随机页面中提取信息，或者举例来说，在这个页面上的这个问题，从“问题标题”部分提取问题标题。并且只以文本的形式将文本从这一页拉到另一页上。当然你不能在这里编辑页面，但只是为了研究目的。顺便说一句，谢谢你的帮助！很高兴知道你有时能做什么和不能做什么！不，浏览器不允许您访问其他域上的页面，除非通过上述跨文档消息传递过程与您共享。大多数站点从外部源获取数据的方式是使用web服务和AJAX调用。