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 下面 ...
随机推荐
- Android内存管理-OnTrimMemory
Application中有两个与内存管理相关的方法:onLowMemory()和 onTrimMemory(int level),源码如下 @CallSuper public void onLowMe ...
- web测试流程的总结及关注点
项目的测试流程大只包含的几个阶段:立项.需求评审.用例评审.测试执行.测试报告文档 一.立项后测试需要拿到的文档 1.需求说明书 2.原型图(及UI图) 3.接口文档 4.数据库字典(表的数量.缓存机 ...
- 把KB转化为KB及以上单位
/** * 把KB转化为KB及以上单位 * @param int $kb * @return string $new_val */ function return_over_kb($kb) { $kb ...
- Servlet:从入门到实战学习(2)---Servlet生命周期
一个Servlet的完整的生命周期(从创建到毁灭)包括:init()方法,service()方法,doGet()方法,doPost()方法,destroy()方法 init()方法用于 Servlet ...
- C#-XML-数据传输
http://www.cnblogs.com/fengxuehuanlin/p/5631664.html 关于xml是属于一个比较重要的东西,在平时开发的过程中,这块内容最主要的是要掌握XML内容的读 ...
- nginx部署及简单优化
研究nginx优化时反复安装清理nginx,为方便做了一个简单部署脚本,用的最新稳定版1.14.0,默认路径,加入systemd系统进程管理中,可以通过systemd管理nginx的启动.终止.重载. ...
- css中的圣杯布局和双飞翼布局
圣杯布局 布局要求: 三列布局,中间自适应,两边定宽 中间栏要在浏览器优先渲染 允许任意列的高度最高 用最简单的CSS.最少的HACK语句 解释说明: 1.min-width:700px是为了当页面缩 ...
- C#网络编程(一)基础篇
简介: C#网络编程API包含在System.Net和System.Net.Sockets命名空间下,大部分网络操作都可以在其中找到相应的类来实现:包括Socket的创建和连接,网络流收发方法的封装, ...
- Visual Studio Code (vscode)编译C++
Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮.智能代码补全.自定义热键.括号匹配.代码片段. ...
- December 16th 2016 Week 51st Friday
My life is a straight line, turning only for you. 我的人生是一条直线,转弯只是为了你. My life is a straight line that ...