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

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

Patricia Arquette
发布: 2024-12-09 02:21:10
原创
376 人浏览过

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中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板