如何获取网页兄弟iframe里的元素,如何调用网页兄弟iframe里的事件

最新推荐文章于 2023-06-16 11:26:41 发布
最新推荐文章于 2023-06-16 11:26:41 发布
阅读量1.2k 收藏 1
点赞数
分类专栏： javascript学习总结 文章标签： iframe js html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ningxi_/article/details/96148622
版权

使用Js方法，如何获取网页兄弟iframe里的元素，如何调用网页兄弟iframe里的事件？

一、案例：

....

<body>

<iframe id="a1"><input type="button" id="btn_Search" οnclick=""/></iframe>

<iframe id="a2"></iframe>

</body>

....

 

二、使用Js方法，在a2页面，获取a1页面的元素

//找兄弟a1的iframe
let iframe = parent.document.getElementById("a1");
//找iframe里的document（某些浏览器不支持contentDocument，需结合contentWindow.document使用）
let iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
//对iframe里的元素操作(有时候能找到，但不触发，需要重新打开网站)
iframeDocument.getElementById("btn_Search").click();

ningxi_
关注
专栏目录
layui获取兄弟界面元素
weixin_45344442的博客
03-24 1082
layui获取兄弟界面元素 `` 方法一、亲测有效 var getFrames=$(parent.document).find("iframe");//获取页面中的iframe var brotherFrame=getFrames[0];//获取刷新的iframe brotherFrame.contentWindow.layui.table.reload('tapendingList'...
JS 在iframe子页面中调用和获取iframe父页面的方法和元素，以及在firame父页面中调用和获取iframe子页面的方法和元素
旭东怪的博客
09-19 7972
1、在子iframe中调用父窗口的方法 test()是父窗口中的方法。 window.parent.test(); 2、在子iframe中获取父窗口的元素 test是父窗口中的元素。 $("#test",window.parent.document).val(); $("#test",parent.document).val(); ...
iframe父子兄弟之间调用传值(contentWindow && parent)
weixin_39214481的博客
12-17 1031
iframe的调用包括以下几个方面：（调用包含html dom，js全局变量，js方法） 主页面调用iframe； iframe页面调用主页面； 主页面的包含的iframe之间相互调用；   主要知识点 1：document.getElementById("ii").contentWindow 得到iframe对象后，就可以通过contentWindow得到iframe包含页面的win...
iframe兄弟页面相互调用
07-06
内涵iframe子页面调用兄弟页面的demo console 输出函数的自定义方法
iframe中调用兄弟iframe和父iframe中的元素
qq_35449428的博客
08-19 1004
今天在做项目时，遇到了在一个iframe中调用兄弟iframe中的元素，现实开发中难免会遇到子页面、父页面相互操作的情况，由于时不时地会遇到几次（不是一次），所以就整理了一下父子页面相互相互调用常见的方法，作为自己的备忘录，同时也希望对大家有帮助。 下面话不多说了，来一起看看详细的介绍吧。 父页面代码 main.html 如下： <!DOCTYPE html> <html ...
layui里 同级兄弟layer里的iframe方法调用
qq_24687915的博客
06-05 1441
比如我们有一个页面A，然后页面B和C是其子页面，在页面A中打开B页面，然后咋B中用parent.layer.open，打开C页面，这样B和C就是A页面下的同级（兄弟）页面（也可以是在A中直接打开B和C）。 其实就是在打开的时候设置id，这个id会是layeriframe外面一层div的id，获得它自然能够获得其中的iframe A中打开B layer.open({ id:"layer-iframe-B", //此处与添加layer的id一样，由于两页面不会同时打开，所以.
使用 js / jQuery获取iframe中的元素
css_666的博客
02-08 1502
1.在父页面中获取子iframe中的元素： js: window.frames["iframe的name值"].document.getElementById("iframe中控件的ID"); jQuery: $("#iframe的ID").contents().find("#目标元素的ID") 注意：在获取子页面的时候，如果子页面尚未加载完毕，上述方法会获取不到。尽量不要在...
【javascript】iframe父子兄弟之间调用传值(contentWindow && parent) (推荐)
PHP在线开发笔记
04-03 4810
iframe的调用包括以下几个方面：（调用包含html dom，js全局变量，js方法）   主页面调用iframe；   iframe页面调用主页面；   主页面的包含的iframe之间相互调用；       主要知识点   1：document.getElementById("ii").contentWindow 得到iframe对象后，就可以通过contentWind
简单了解Javscript中兄弟ifream的方法调用
10-16
这种情况下，我们可以利用JavaScript提供的DOM操作和全局变量来实现兄弟iframe间的方法调用。下面我们将详细介绍这个过程。 首先，假设我们有两个兄弟iframe，一个名为A，另一个名为B。如果iframe A想要调用iframe ...
html 获取下一个兄弟节点,JS/JQuery获取当前元素的上一个/下一个兄弟级元素等元素的方法...
weixin_35079144的博客
06-07 2199
$(function(){//遍历获取的input元素对象数组，绑定click事件var len = $("input[type='file']").length;for(var i = ; i < len; i++){$("input[type='file']").eq(i).click(function(){$(this).next().val("");$(this).next().hi...
Js/Jquery获取iframe中的元素（window、document）
menghuanzhiming的博客
12-09 3657
参考地址： Window frames 属性：https://www.runoob.com/jsref/prop-win-frames.html jQuery 遍历 - contents() 方法：https://www.w3school.com.cn/jquery/traversing_contents.asp 获取iframe中的window对象： //js document.getEle...
Iframe父子兄弟之间的调用
iteye_10299的博客
08-21 691
今天在做项目时，遇到了在一个iframe中调用兄弟iframe中的元素，网上找了一些材料，总结知识点如下： iframe的调用包括几个方面： 1、主页面iframe调用子iframe；2、子iframe调用主iframe的元素；3各个iframe之间元素的相互调用   1：document.getElementById("ii").contentWindow 得到iframe对象后，就可...
内嵌页面iframe以及和其兄弟iframe的相互传值
你又来了
11-16 2684
摘要: iframe的调用包括以下几个方面：（调用包含html dom，js全局变量，js方法） 主页面调用iframe； iframe页面调用主页面； 主页面的包含的iframe之间相互调用； 主要知识点 1：document.getElementById("ii").contentWindow 得到iframe对象后，就可以通过contentWindow得到iframe包含页面
frame父子兄弟之间通过jquery传值
Fly to sky
05-08 475
frame父子兄弟之间通过jquery传值(contentWindow && parent)，iframe的调用包括以下几个方面：（调用包含html dom，js全局变量，js方法）主页面调用iframe；iframe页面调用主页面；主页面的包含的iframe之间相互调用；主要知识点1：document.getElementById("ii").contentWindow 得到iframe对象后，
html中iframe调用兄弟iframe中的js方法
老徐的博客只有干货
01-26 3510
问题说明 最近工作中碰到一个页面有一个主iframe A，用于操作主要业务元素。其中有一个弹出框里面也嵌入了一个iframe B， 此时，我需要在B中调用A中JS的指定方法。下面咱们来通过例子还原一下这个场景，看如何实现的。 主页面html testframe.html iframe1即A页面
jquery兄弟标签_jQuery----获取兄弟元素的方法
weixin_39956110的博客
12-20 2315
① $(this).next()； 获取的是当前元素的下一个兄弟元素②$(this).nextAll(); 获取的是当前元素的后面的所有的兄弟元素③$(this).prev(); 获取的是当前元素的前一个兄弟元素④$(this).prevAll(); 获取的是当前元素的前面的所有的兄弟元素⑤$(this).siblings(); ...
JS访问iframe内button控件
jackwofe的专栏
11-06 2081
 document.getElementById("mainframe").contentWindow.document.getElementById("btdel").click();
iframe父页面调用子页面方法，并且获取数据（无跨域）
最新发布
weixin_48195664的博客
06-16 2689
以上就是 iframe父页面调用子页面方法，并且获取数据（无跨域）最难部分就是跨越了。一定要注意：父子页面两边都要监听，子页面监听父页面传过来的参数，再根据参数判断调取哪个方法。父页面监听子页面传过来的数据。(注意：VUE的话将此方法写在mounted里边，如果是多次调取此方法的话，就换成window.onmessage=(e)=>{}2. 监听父页面传过来的参数来判断调取哪个方法。
iframe的快速使用及方法的调用（HTML中引入另一个HTML文件）
z1093541823的博客
04-14 2187
iframe的快速使用及方法的调用； HTML中引入另一个html文件；
iframe里面的网页怎么获取到iframe的dom
05-27
在iframe内部获取到父窗口（包含iframe的窗口）的DOM对象，可以使用`window.parent`。在父窗口中获取到iframe的DOM对象，可以使用`document.getElementById("iframe-id").contentWindow.document`，其中`iframe-id`是iframe元素的id属性值。例如，如果iframe元素的id属性值为`my-iframe`，则可以使用以下代码获取到iframe的DOM对象： ```javascript var iframe = document.getElementById("my-iframe").contentWindow.document; ``` 需要注意的是，由于浏览器的安全策略限制，跨域的iframe无法直接获取到其它域名下的DOM对象。如果iframe的src属性值与父窗口的域名不同，那么在iframe内部获取到父窗口的DOM对象时，会抛出SecurityError异常。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值