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 框架 父页面与子界面之间的变量、函数、元素获取的更多相关文章

  1. iframe 框架父页面刷新子页面

    1.父页面添加: <script> function testBtn(){   var reshSrc = document.getElementById('myFrame').src; ...

  2. iframe中父页面与子页面的传值方法

    涉及到iframe传值的情况有这么几种:(1)父页面给iframe中的子页面传值(2)子页面调用父页面中的函数(3)iframe中的子页面给父页面传值(4)兄弟iframe之间的传值 下面来逐一看一下 ...

  3. iframe中 父页面和子页面查找元素的方法

    从父页面中查找iframe子页面中对象的方法:JS: document.getElementById('iframe').contentWindow //查找iframe加载的页面的window对象 ...

  4. 前端vue框架 父组件与子组件之间的相互调用

    子组件调用父组件东西: 1.在父组件与子组件契合的标签的的template模板中绑定 v-bind:自定义一个名字=“要调用的名字” 2.在子组件的script中props:["自定义的名字 ...

  5. 关于iframe的父页面调取子页面里的事件(父往子里传)

    在body里打开一个iframe页面,想要调取打开的这个页面里的函数: $('iframe')[0].contentWindow.sonFn(canshu); [0]:比如在index.html页面里 ...

  6. 父页面调用子页面js的方法

    iframe子页面调用父页面javascript函数的方法今天遇到一个iframe子页面调用父页面js函数的需求,解决起来很简单,但是在chrome浏览器遇到一点小问题.顺便写一下iframe的父页面 ...

  7. Iframe父页面与子页面之间的调用

    原文:Iframe父页面与子页面之间的调用 Iframe父页面与子页面之间的调用 专业词语解释如下:     Iframe:iframe元素是文档中的文档.     window对象: 浏览器会在其打 ...

  8. Iframe父页面与子页面之间的相互调用

    iframe元素就是文档中的文档. window对象: 浏览器会在其打开一个HTML文档时创建一个对应的window对象.但是,如果一个文档定义了一个或者多个框架(即:包含一个或者多个frame或者i ...

  9. IFrame父页面和子页面的交互

    现在在页面里面用到iframe的情况越来越少了,但有时还是避免不了,甚至这些页面之间还需要用js来做交互,那么这些页面如何操作彼此的dom呢?下面将会逐步介绍. 1.父页面操作子页面里面的dom 下面 ...

随机推荐

  1. Android内存管理-OnTrimMemory

    Application中有两个与内存管理相关的方法:onLowMemory()和 onTrimMemory(int level),源码如下 @CallSuper public void onLowMe ...

  2. web测试流程的总结及关注点

    项目的测试流程大只包含的几个阶段:立项.需求评审.用例评审.测试执行.测试报告文档 一.立项后测试需要拿到的文档 1.需求说明书 2.原型图(及UI图) 3.接口文档 4.数据库字典(表的数量.缓存机 ...

  3. 把KB转化为KB及以上单位

    /** * 把KB转化为KB及以上单位 * @param int $kb * @return string $new_val */ function return_over_kb($kb) { $kb ...

  4. Servlet:从入门到实战学习(2)---Servlet生命周期

    一个Servlet的完整的生命周期(从创建到毁灭)包括:init()方法,service()方法,doGet()方法,doPost()方法,destroy()方法 init()方法用于 Servlet ...

  5. C#-XML-数据传输

    http://www.cnblogs.com/fengxuehuanlin/p/5631664.html 关于xml是属于一个比较重要的东西,在平时开发的过程中,这块内容最主要的是要掌握XML内容的读 ...

  6. nginx部署及简单优化

    研究nginx优化时反复安装清理nginx,为方便做了一个简单部署脚本,用的最新稳定版1.14.0,默认路径,加入systemd系统进程管理中,可以通过systemd管理nginx的启动.终止.重载. ...

  7. css中的圣杯布局和双飞翼布局

    圣杯布局 布局要求: 三列布局,中间自适应,两边定宽 中间栏要在浏览器优先渲染 允许任意列的高度最高 用最简单的CSS.最少的HACK语句 解释说明: 1.min-width:700px是为了当页面缩 ...

  8. C#网络编程(一)基础篇

    简介: C#网络编程API包含在System.Net和System.Net.Sockets命名空间下,大部分网络操作都可以在其中找到相应的类来实现:包括Socket的创建和连接,网络流收发方法的封装, ...

  9. Visual Studio Code (vscode)编译C++

    Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮.智能代码补全.自定义热键.括号匹配.代码片段. ...

  10. December 16th 2016 Week 51st Friday

    My life is a straight line, turning only for you. 我的人生是一条直线,转弯只是为了你. My life is a straight line that ...