获取iframe中的DOM元素

最新推荐文章于 2024-08-14 20:30:39 发布
最新推荐文章于 2024-08-14 20:30:39 发布
阅读量1.1w 收藏 7
点赞数 2
分类专栏： 前端 文章标签： jquery html5 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Huuc6/article/details/120560060
版权
本文介绍了如何在JavaScript和jQuery中正确获取iframe加载完成后的DOM元素。强调了必须等待iframe加载完毕才能进行操作，否则会因iframe未加载完全导致错误。
摘要由CSDN通过智能技术生成

在iframe没有加载完毕时，是无法直接从根document获得iframe中的DOM节点的

  • ① 先获取页面中的iframe元素
  • ② 等待iframe加载完毕

假设页面中有若干iframe，其中index=1的iframe中有需要的元素.cke_show_borders

通过JS实现：

  let iframeDocument = document.getElementsByTagName('iframe')[1].contentDocument;
  let
最低0.47元/天 解锁文章
ZiuC
关注
专栏目录
最佳实践之直接操作跨域 iframe 的 DOM
mon_star°的博客
07-24 430
当遇到跨域 iframe 的 DOM 访问被阻止时，通常不能直接在 JavaScript 中通过来访问 iframe 的内容，因为浏览器的同源策略会阻止这种操作。如果可能，将 iframe 的内容部署到与主页面相同的源（即相同的协议、域名和端口）。这是最简单也最安全的方法。如果 iframe 的内容不在你的控制之下，但 iframe 的源允许跨域通信，你可以使用方法与 iframe 进行通信。iframe 中的代码需要监听message事件并处理来自你的主页面的消息。但是，
Js/Jquery获取iframe中的元素
skysky_1989的博客
11-23 1061
在web开发中，经常会用到iframe，难免会碰到需要在父窗口中使用iframe中的元素、或者在iframe框架中使用父窗口的元素。 js 在父窗口中获取iframe中的元素 1. 格式：window.frames["iframe的name值"].document.getElementById("iframe中控件的ID").click(); 实例：window.fr...
vue怎么获取DOM？
最新发布
weixin_58462329的博客
08-14 376
【代码】vue怎么获取DOM？
vue项目获取 iframe 中的DOM元素
sun~的博客
01-03 2938
注意，由于跨域的安全限制，只能访问同源的 iframe 内容。如果 iframe 的源与父组件的源不同，那么在访问其内容时可能会遇到跨域错误。
用javascript访问操作iframe里的dom
Shawn的ADF空间
10-23 1024
很多人一直都有个想法，要是可以随心所欲的操作iframe就好了。这样静态页面也就有了相当于后台动态页面php,jsp,asp中include，require实现统一多页面布局的能力。 通过Javascript的帮忙我们可以像后台一样动态加载操作iframe对象属性src指向的html页面的内容。这样的操作需要提供两个页面，一个页面是iframe所在页面(页面名称：iPage.html)，另一个页
笔记：javascript操作iframe内的DOM元素，及调用iframe内的方法
weixin_30463341的博客
03-02 669
iframe相当于一个嵌入在网页内的浏览器，它与当前网页是隔离的。 但有时我们也需要在当前网页操作iframe内的元素或操作iframe内的javascript方法。 在网页内操作DOM元素，是使用document对象。那么，当我们需要操作iframe内的元素时，就需要找到iframe内的document对象。 假设有以下HTML代码： <iframe id="ifm" src=...
Jquery方式获取iframe页面中的 Dom元素
10-25
主要介绍了Jquery方式如何获取iframe页面中的Dom元素,需要的朋友可以参考下
jquery获取iframe中的dom对象
weixin_30667649的博客
07-02 166
父窗口中操作iframe：$(window.frames["iframeChild"].document) //假如iframe的id为iframeChild 在子窗口中操作父窗口：$(window.parent.document) 接下来就可以继续获取iframe内的dom了。 获取iframe内的dom对象有两种方法 1 $(window.frames["iframeChil...
JS操作iframe里的dom
一个有味道的Weber
04-25 3242
JS操作iframe里的dom一、父级窗口操作iframe里的domJS操作iframe里的dom可是使用contentWindow属性，contentWindow属性是指指定的frame或者iframe所在的window对象，在IE中iframe或者frame的contentWindow属性可以省略，但在Firefox中如果要对iframe对象进行编辑则，必须指定contentWindow属性，c
获取Iframe中的元素
忘川
01-19 7295
使用JQuery在父窗口中获取Iframe中的元素： 格式： $("#iframe的id").contents().find("#iframe中控件的id").事件(); // 方式1 $("#iframe中控件的id",document.frames("iframe的name").document).事情(); // 方式2 事例： $("#iframeId").conte...
原生js获取iframe中dom元素--父子页面相互获取对方dom元素的方法
10-21
下面小编就为大家带来一篇原生js获取iframe中dom元素--父子页面相互获取对方dom元素的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
iframe框架\JS获取iframe元素
12-08
iframe框架\JS获取iframe元素
jquery获取iframe中的dom对象(两种方法)
01-19
父窗口中操作iframe：$(window.frames[“iframeChild”].document) //假如iframe的id为iframeChild 在子窗口中操作父窗口：$(window.parent.document) 接下来就可以继续获取iframe内的dom了。 获取iframe内的dom对象有两种方法 1 $(window.frames[“iframeChild”].document).find(“#child”) 2 $(“#child”,window.frames[“iframeChild”].document) 1.在父窗口中操作 选中IFRAME中的所有单选按钮
解析Jquery取得iframe中元素的几种方法
10-27
- **在父窗口中操作iframe中的元素**：如果在父窗口中操作iframe内的元素，可以使用`$("#iframeId", window.parent.document).find("#elementId")`来获取iframe中id为`elementId`的元素。 ### iframe操作父窗口中的...
Jquery获取iframe的DOM元素
zhaoyang10的专栏
12-25 8001
layer弹出层获取子页面iframe的DOM元素： var iframeName = layero.find('iframe')[0]['name']; var container = parent.window.frames[iframeName].document; //或者 winfow.frames[iframeName].document; var monthDate = $('#mo...
回到基础：什么是DOM及DOM操作？
web前端开发
12-25 399
原文 |https://www.valentinog.com/blog/html-table/译文 |https://github.com/qq449245884/xiaozhi/i...
js 获取iframe内dom元素
09-12 5141
var ifr = document.getElementById("myframe2"); var dom= ifr.contentWindow.document.getElementById("textid")
获取iframe的dom元素
08-31
要获取iframe的DOM元素，您可以使用以下步骤： 1. 使用JavaScript中的`document.querySelector()`或`document.getElementById()`方法选择iframe元素。例如，如果您的iframe具有id为"myIframe"，则可以使用以下代码...
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值