iframe 框架 父页面与子界面之间的变量、函数、元素获取
1、获取页面上的iframe
1-1、 document.getElementById('iframeId');
1-2、 window.frames[0]、window.frames['frameName']、frames['frameName']、frames[0]、self.frames[0],此处self与window等价,相当于本页面的window对象。
1-3、 contentWindow、contentDocument两个属性,也是可以用来获取子窗口,
contentWindow 兼容各个浏览器,可取得子窗口的 window 对象。
contentDocument Firefox 支持,> ie8 的ie支持。可取得子窗口的 document 对象。
2、子页面访问父页面元素:
parent.document.getElementById('id')和document相关的方法都可以这样用 ;
3、父页面访问子页面元素:
document.getElementById('iframeId').contentWindow.document.getElementById("id"); contentWindow后跟document相关方法
window.frames[0].contentWindow.document.getElementById("id");
4、子页面访问父页面变量:
parent.a; 或者调用 父页面有返回值的函数解决。
5、父页面访问子页面变量:
父页面声明全局变量,子页面复制修改;或者调用子页面有返回值的函数解决。
frames[0].a;
6、子页面访问父页面方法:
window.parent.parentMethod();
7、父页面访问子页面方法:
document.getElementById('iframeId').contentWindow.iframeMethod();
frames[0].iframeMethod();
8、兄弟框架之间调用:
self.parent.frames['child1'];
self.parent.frames['child2'];
9、多层框架的调用:
window.frames[0].frames[2];
window.frames['child_1'].frames['sub_child_3'];
iframe 框架 父页面与子界面之间的变量、函数、元素获取的更多相关文章
- iframe 框架父页面刷新子页面
1.父页面添加: <script> function testBtn(){ var reshSrc = document.getElementById('myFrame').src; ...
- iframe中父页面与子页面的传值方法
涉及到iframe传值的情况有这么几种:(1)父页面给iframe中的子页面传值(2)子页面调用父页面中的函数(3)iframe中的子页面给父页面传值(4)兄弟iframe之间的传值 下面来逐一看一下 ...
- iframe中 父页面和子页面查找元素的方法
从父页面中查找iframe子页面中对象的方法:JS: document.getElementById('iframe').contentWindow //查找iframe加载的页面的window对象 ...
- 前端vue框架 父组件与子组件之间的相互调用
子组件调用父组件东西: 1.在父组件与子组件契合的标签的的template模板中绑定 v-bind:自定义一个名字=“要调用的名字” 2.在子组件的script中props:["自定义的名字 ...
- 关于iframe的父页面调取子页面里的事件(父往子里传)
在body里打开一个iframe页面,想要调取打开的这个页面里的函数: $('iframe')[0].contentWindow.sonFn(canshu); [0]:比如在index.html页面里 ...
- 父页面调用子页面js的方法
iframe子页面调用父页面javascript函数的方法今天遇到一个iframe子页面调用父页面js函数的需求,解决起来很简单,但是在chrome浏览器遇到一点小问题.顺便写一下iframe的父页面 ...
- Iframe父页面与子页面之间的调用
原文:Iframe父页面与子页面之间的调用 Iframe父页面与子页面之间的调用 专业词语解释如下: Iframe:iframe元素是文档中的文档. window对象: 浏览器会在其打 ...
- Iframe父页面与子页面之间的相互调用
iframe元素就是文档中的文档. window对象: 浏览器会在其打开一个HTML文档时创建一个对应的window对象.但是,如果一个文档定义了一个或者多个框架(即:包含一个或者多个frame或者i ...
- IFrame父页面和子页面的交互
现在在页面里面用到iframe的情况越来越少了,但有时还是避免不了,甚至这些页面之间还需要用js来做交互,那么这些页面如何操作彼此的dom呢?下面将会逐步介绍. 1.父页面操作子页面里面的dom 下面 ...
随机推荐
- unzipping/Users/xq/.gradle/wrapper /dists/gradle-3.3-all/55gk2rcmfc6p2dg9u9ohc3hw9/gradle-3.3-all.zi
unzipping/Users/xq/.gradle/wrapper /dists/gradle-3.3-all/55gk2rcmfc6p2dg9u9ohc3hw9/gradle-3.3-all.zi ...
- 安卓app开发-05-Android xml布局详细介绍
安卓app开发-05-Android xml布局详细介绍 虽然说有 墨刀,墨客 这些图形化开发工具来做 Android 的界面设计,但是我们还是离不开要去学习做安卓原生app,学习 xml 布局还是必 ...
- [2014年学习计划之RoR系列] 第二步 – 熟悉Ruby语言 (2/n) Blocks and Iterators (代码块和迭代器)
[就算没有含金量,也请尊重原创, 转载自我的独立博客http://brucejia.net] Blocks and Iterators (代码块和迭代器) 代码块和迭代器是Ruby语言中比较有特点的东 ...
- 基于Vue的WebApp项目开发(五)
实现图片分享列表 步骤一:新增图片列表文件photolist.vue <template> <div id="tml"> 图片分享页面 </div&g ...
- java笔记--正则表达式的运用(包括电话,邮箱验证等)
正则表达式 --如果朋友您想转载本文章请注明转载地址"http://www.cnblogs.com/XHJT/p/3877402.html "谢谢-- 正则表达式符号:" ...
- java "Too small initial heap" 错误
Tomcat内存配置 JAVA_OPTS="-server -Duser.timezone=GMT+08-Xms1024m -Xmx1024m -XX:PermSize=1024m -Xmn ...
- MVC controller的Action获取HttpRequest
HttpContext.ApplicationInstance.Context.Request
- Matlab基础 数组
一.引用 数组元素引用,下标从1开始 如y(3)表示第3个元素 二.扩充 扩充2*3矩阵为3*3矩阵,并且给a(3,3)赋值为9 三.提取 数组按列存储 全下标变化为单下标: sub2ind((m,n ...
- 音乐mp4网站 汽车服务工程 张旭
- MapReduce Design Patterns(chapter 2(part 1))(二)
随着每天都有更多的数据加载进系统,数据量变得很庞大.这一章专注于对你的数据顶层的,概括性意见的设计模式,从而使你能扩展思路,但可能对局部数据是不适用的.概括性的分析都是关于对相似数据的分组和执行统计运 ...