首页 >web前端 >js教程 >如何使用纯 JavaScript 访问 Iframe 的 InnerHTML?

如何使用纯 JavaScript 访问 Iframe 的 InnerHTML?

Patricia Arquette
Patricia Arquette原创
2024-12-09 02:21:10370浏览

How Can I Access the InnerHTML of an Iframe Using Pure JavaScript?

在 JavaScript 中访问 iframe 的内部内容

在 HTML 中,iframe 元素在其自己的文档中嵌入另一个网页。要与嵌入页面的内容进行交互,父文档需要访问其正文的内容。

考虑以下 iframe:

<iframe>

目标是检索文本“test< br/>”

纯 JavaScript 解决方案

要以纯 JavaScript 访问 iframe 的正文内容,请使用以下技术:

1 。获取iframe元素:

var iframe = document.getElementById('id_description_iframe');

2.获取 iframe 的文档对象:

var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;

3.选择 iframe 中的 body 元素:

var iframeContent = iframeDocument.getElementById('frameBody');

4.访问body元素的innerHTML获取内容:

var iframeBodyContent = iframeContent.innerHTML; // "test<br/>"

补充说明:

  • 此方案需要同源策略需要观察。
  • 如果 iframe 来自不同的框架,请考虑使用跨域消息传递或 CORS域。
  • 此技术不仅允许您检索正文的内容,还可以选择和操作 iframe 内的元素。

以上是如何使用纯 JavaScript 访问 Iframe 的 InnerHTML?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn