iframe父子页面操作-比较好用的两个方法-window.parent/oframe.contentWindow.document

发现比较好用的iframe父子页面操作方法，记录一下

1.父页面 test.html

获取iframe var oframe = document.getElementById("main")

获取子页面 var child = oframe.contentWindow.document

获取子页面元素 var test = child.getElementById("test")

获取子页面高度 var childh = child .body.offsetHeight

获取子页面高度

2.子页面 iframe.html

获取父页面 var parent = window.parent.document

注意：需要把代码放在服务器端，才能兼容google浏览器

时间： 2024-08-13 22:51:23

iframe父子页面操作-比较好用的两个方法-window.parent/oframe.contentWindow.document的相关文章

iframe父子页面交互

以下的父页面与子页面交互的方法必须起一个页面服务才能使用(通过域名来访问)并且的保证父页面与子页面是在同一域名下,不然是会报错的父页面调用子页面获取父页面的ifram的id或calss之后可以通过contentWindow这个对象获取子页面的元素和方法.父页面调用子页面的元素和方法时,必须要等iframe加载完毕,或者在onload 方法里执行,不然是获取不到的! contentWindow 可取得子窗口的 window 对象. document.getElementById('main')

iframe父子页面通信

一.同域下父子页面的通信 1.父页面调用子iframe页面 (1)通过iframe的Id获取子页面的dom,然后通过内置属性contentWindow取得子窗口的window对象,此方法兼容各个浏览器 document.getElementById('iframe_Id').contentWindow // contentWindow 不能省略 (2)通过iframe的name直接获取子窗口的window对象 iframe_Name.window //window可以省略 (3)通过win

JS原生父子页面操作

var api = frameElement.api; //当前 W = api.opener;//父页面 W.setPerSel(jsonStr); api.close(); //关闭窗口 js操作frame详细解说,window.opener和window.parent的区别 frame框架里的页面要改其他同框架下的页面或父框架的页面就用parentwindow.opener引用的是window.open打开的页面的父页面. window.frames对象可以引用iframe里的页面,也可

iframe父子页面之间相互调用元素和函数

1 <!doctype html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <meta name="Keywords" content=""> 6 <meta name="Description" con

基于iframe父子页面传值的方法。

之前项目中用layer.js作为弹窗的框架,发现layer.js中大部分弹窗都是通过iframe模拟的.为此,在项目中遇到了不少坑.印象最深的就是父子页面传值的问题.后面经过一段时间的研究.总结出以下几种方法: 一.在子页面的js中直接使用parent获取父级页面中的对象方法.如: $(document).ready(function(){ $("#people_add_cardActiveTime").text(laydate.now(0, 'YYYY-MM-DD 00:00:00'

iframe父子页面通讯

由于公司的service后台,是前端搭的架子,里面各个tab菜单栏都是不同的工程,通过iframe来嵌套,在业务越来越复杂的情况下,总是避免不了iframe之间的通讯, 下面是两种iframe之间的通讯: 1.父子iframe通过监听来实现在iframe的子页面里使用postMessage向父级页面传参: window.parent.postMessage({type: "closeIbooking", fromSource: "turnoffIbooking"}

easyUI的iframe子页面操作父页面元素

曾经试过这样的方法在iframe子页面获取父页面元素代码如下: $('#objId', parent.document); 这样可以获得父页面的元素,但是调用EasyUI的方法的时候,就会报错. 郁闷了很久很久,最终找到方案,写法的区别,如下: parent.$('# objId') 这样调用方法就不会报错如: parent.$('# objId').tabs("add", { title: title, content: content, closabl

转 easyUI的iframe子页面操作父页面元素

曾经试过这样的方法在iframe子页面获取父页面元素代码如下: $('#objId', parent.document); 这样可以获得父页面的元素,但是调用EasyUI的方法的时候,就会报错. 郁闷了很久很久,最终找到方案,写法的区别,如下: parent.$('#objId') 这样调用方法就不会报错如: parent.$('#objId').tabs("add", { title: title, content: content, c

iframe 父子页面方法调用

在写代码的时候经常会用到将一个网页嵌入到另一个网页中,w3c也规定了一个标签<iframe>,这个标签本身就支持跨域,而且所有的浏览器都支持 iframe具有以下属性: 1.frameborder 设为1代表显示周围边框,设置为0不显示周围边框 2.height 设置iframe的高度 3.width 设置iframe的宽度 4.longdesc 属性值为URL 规定一个页面,该页面包含了有关 iframe 的较长描述 5.marginheight 定义 iframe 的顶部和底部的边距 6.