html父页面中获取iframe中子页面属性方法

最新推荐文章于 2023-11-21 10:59:59 发布
最新推荐文章于 2023-11-21 10:59:59 发布
阅读量3.1k 收藏
点赞数
分类专栏： Web前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_35048277/article/details/79999910
版权 
document.getElementById('iframe的id').contentWindow.属性/方法;

震霄云天
关注
专栏目录
iframe子页面与父页面元素的访问以及js变量的访问
qq_27009517的博客
07-14 3506
后台管理系统嵌套了很多iframe页面，想要取得父页面的元素，需要特殊的写法，总是记不住，写下来方便寻找 // eg：iframe页面找父页面的 #nav $('#nav',parent.document) var order = $("nav.J_menuTabs a[data-id*=importOrderExcel]", parent.document); if(order.length){ $(".csEntityImport").hide(); }else{ ...
在父页面调用iframe子页面的JS方法
热门推荐
heartbeaty的专栏
02-18 4万+
parent function parentFunction() { alert('function in parent'); } function callChild() { child.window.childFunction(); /* child 为iframe的name属性值， 不能为id，因为在FireFox下id不能获取iframe对象 */ }
父页面获取子页面参数
03-14
jsp父页面嵌套子页面的内容，子页面获取父页面的参数很容易，但是想要反过来，却有些困难。本文档中，作者详细地写出了实现办法，需要帮助的朋友可以参考一下。
父<IFRAME>获取子页属性以及子页中<IFRAME>的方法
a421991464的博客
03-25 147
例子如下： 1.父页index.jsp <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><h...
获取HTML页面中的iFrame及其内部对象
weixin_34344677的博客
04-27 502
2019独角兽企业重金招聘Python工程师标准>>> ...
iframe父页面获取子页面的参数
牛栏山矿泉水
02-13 327
1、父页面中的iframe &lt;iframe name="parentPage"&gt;&lt;/iframe&gt; 2、子页面中元素的属性 &lt;input type="text" id="date" data-dojo-type="dijit/form/DateTextBox" value="2013-11-12"/&gt; 3、取子
子页面获取上级页面的属性
pheobi的博客
08-21 561
case1.子页面获取父页面属性 window.parent.属性 case2.在A页面通过超链接打开B页面<a href='{0}' target='_blank'>{1}</a> 在B页面获取A的父页面中的属性 window.opener在B页面获取A页面 window.opener.parent在B页面获取A页面父页面 ...
iframe中子父类窗口调用JS的方法及注意事项
10-23
在父窗口中，若想调用子iframe中的方法，可以通过`iframe`的name或id属性获取到iframe元素，并通过其`contentWindow`属性访问到iframe的Window对象，进而调用方法。例如： ```javascript document.getElementById(...
js中子页面获取父页面ID
10-31
### js中子页面获取父页面ID 在JavaScript中，经常会出现需要从子页面（通常是`iframe`中的页面）访问或操作父页面元素的情况。本文将详细介绍如何实现子页面调用父页面ID，并对其进行操作。 #### 理解基本概念 ...
layui弹出层子页面获取父级页面元素
testHjy的博客
11-24 3620
需求：点击父页面内容库，弹出子页面列表，点击添加按钮，将子页面信息回填到父页面中对应的区域。同过ID找到元素，再用$(元素)转为对象，再复制即可。
使用嵌套的iframe父级页面使用子级页面的数据
qq_44866810的博客
11-21 340
属性来获取嵌套的iframe的。，并将其传递给子级页面中名为。在父级页面中，你可以使用。这个函数接受一个参数。
4.iframe子页面与父页面间的方法，属性互相调用
风子的博客
05-18 5773
以下方式亲测可以使用 1.建议一个动态web工程，本人使用的是eclipse，建立两个jsp页面及一个jquery插件，一个是父页面，一个子页面 &amp;amp;amp;amp;lt;%@ page language=&amp;amp;amp;quot;java&amp;amp;amp;quot; contentType=&amp;amp;amp;quot;text/html; charset=UTF-8&amp;amp;amp;quot; p
html中嵌入iframe进行父子页面参数传递
似水流年
11-27 1688
实现的主要原理是： 1.父页面调用子页面函数，选择iframe的id +contentWindow +子页面的函数名（[参数列表]） 2.子页面调用父页面函数，window.parent.父页面的函数名（[参数列表]） 以下是测试代码： 父页面： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>父页面<..
iframe子页面与父页面间的方法，属性互相调用
AI菜鸡，NLP领域，至今为发不出论文掉头发
08-29 1185
以下方式亲测可以使用 1.建议一个动态web工程，本人使用的是eclipse，建立两个jsp页面及一个jquery插件，一个是父页面，一个子页面 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String path =...
Jquery 获取 iframe 父页面与子页面的元素和方法
清山博客
05-30 2万+
1.在页面中查找 iframe 页面元素： $("#iframe").contents().find("#id") 2.在 iframe 中查找父页面元素： $("#id", parent.document) 3.在 iframe 中调用父页面中定义的方法和变量： parent.method parent.value
html5父子页面代码,关于使用iframe的父子页面进行简单的相互传值
weixin_39980347的博客
06-04 478
当一个页面使用了iframe作为嵌套时，如何想要将父页面的数据传给iframe子页面，那iframe所指向的呢个子页面是怎么获取呢，又或者子页面的数据要给父页面使用，那么父页面又如何获取子页面的数据呢？下面根据这种情况作了一个简单的demo案例：父页面是parentpage.html，子页面是childpage.html。1、情况一：父页面获取子页面传入的数据(子页面给父页面传值)父页面：//获取...
父页面调用子页面的js函数
alenejinping的专栏
07-01 637
父页面调用子页面的js函数
html父页面如何向iframe框架中的页面传递参数
最新发布
09-12
在HTML中，父页面向iframe框架中的页面传递参数可以通过设置iframe的src属性或使用JavaScript来实现。以下是两种常见的方法： 1. 使用URL参数传递： 在父页面中，可以通过在iframe的src属性中加入查询字符串（query string）来传递参数。例如： ```html <iframe src="child_page.html?param1=value1&param2=value2" ...></iframe> ``` 在iframe框架中的child_page.html页面里，可以通过JavaScript来获取这些参数： ```javascript function getQueryVariable(variable) { var query = window.location.search.substring(1); var vars = query.split('&'); for (var i = 0; i < vars.length; i++) { var pair = vars[i].split('='); if (decodeURIComponent(pair[0]) == variable) { return decodeURIComponent(pair[1]); } } return null; } var param1 = getQueryVariable('param1'); // 获取param1的值 var param2 = getQueryVariable('param2'); // 获取param2的值 ``` 2. 使用JavaScript的window.postMessage方法： HTML5引入了window.postMessage方法，它提供了一种安全的方式来实现跨源通信，即允许一个页面和另一个“不同源”的页面进行通信。父页面和iframe页面可以约定一个事件监听和触发机制来传递参数。 父页面向iframe发送消息： ```javascript var iframe = document.getElementById('iframeId'); var iframeWindow = iframe.contentWindow; iframeWindow.postMessage({param1: 'value1', param2: 'value2'}, '*'); ``` iframe中的页面接收消息： ```javascript window.addEventListener('message', receiveMessage, false); function receiveMessage(event) { var data = event.data; if (data.param1) { console.log(data.param1); // 使用param1的值 } if (data.param2) { console.log(data.param2); // 使用param2的值 } } ``` 在使用postMessage时，必须确保接收和发送页面遵守相同的安全协议和端口，否则postMessage会失败。通常需要在iframe页面和父页面上都设置消息监听器。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值