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. 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 ...

  2. 安卓app开发-05-Android xml布局详细介绍

    安卓app开发-05-Android xml布局详细介绍 虽然说有 墨刀,墨客 这些图形化开发工具来做 Android 的界面设计,但是我们还是离不开要去学习做安卓原生app,学习 xml 布局还是必 ...

  3. [2014年学习计划之RoR系列] 第二步 – 熟悉Ruby语言 (2/n) Blocks and Iterators (代码块和迭代器)

    [就算没有含金量,也请尊重原创, 转载自我的独立博客http://brucejia.net] Blocks and Iterators (代码块和迭代器) 代码块和迭代器是Ruby语言中比较有特点的东 ...

  4. 基于Vue的WebApp项目开发(五)

    实现图片分享列表 步骤一:新增图片列表文件photolist.vue <template> <div id="tml"> 图片分享页面 </div&g ...

  5. java笔记--正则表达式的运用(包括电话,邮箱验证等)

    正则表达式 --如果朋友您想转载本文章请注明转载地址"http://www.cnblogs.com/XHJT/p/3877402.html "谢谢-- 正则表达式符号:" ...

  6. java "Too small initial heap" 错误

    Tomcat内存配置 JAVA_OPTS="-server -Duser.timezone=GMT+08-Xms1024m -Xmx1024m -XX:PermSize=1024m -Xmn ...

  7. MVC controller的Action获取HttpRequest

    HttpContext.ApplicationInstance.Context.Request

  8. Matlab基础 数组

    一.引用 数组元素引用,下标从1开始 如y(3)表示第3个元素 二.扩充 扩充2*3矩阵为3*3矩阵,并且给a(3,3)赋值为9 三.提取 数组按列存储 全下标变化为单下标: sub2ind((m,n ...

  9. 音乐mp4网站 汽车服务工程 张旭

  10. MapReduce Design Patterns(chapter 2(part 1))(二)

    随着每天都有更多的数据加载进系统,数据量变得很庞大.这一章专注于对你的数据顶层的,概括性意见的设计模式,从而使你能扩展思路,但可能对局部数据是不适用的.概括性的分析都是关于对相似数据的分组和执行统计运 ...