【转】iframe和父页,window.open打开页面之间的引用

iframe和父页,window.open打开页面和被打开页面之间的关系可以通过下面的对象获取到

  1)通过iframe加载的,在iframe中用parent对象得到父页window作用域,如果iframe中又加载了iframe,在最里层的iframe中需要重复调用parent.parent得到其上一级iframe的引用。如果是直接引用最顶级的父页作用域,可以使用top对象。

  2)父页使用document.getElementById("iframe的id").contentWindow得到iframe的window作用域,如果iframe还继续嵌套了iframe,则还需要继续执行.getElementById("iframe的id").contentWindow操作才能得到内层iframe的作用域。如:

 var ifrWin=document.getElementById("iframe的id").contentWindow.getElementById("再次被嵌套的iframe的id").contentWindow;

  

  3)aaa.html中使用 var win=window.open("xxx.html"),win就是xxx.html的window作用域,xxx.html中使用opener对象得到打开这个页面的window作用域。如果xxx.html又打开了bbb.html,那么bbb.html中使用opener.opener得到aaa.html作用域,aaa.html要想得到bbb.html作用域,那么xxx.html需要保存打开bbb.html的作用域如var win=window.open("bbb.html"),那么aaa.html通过win.win就得到bbb.html的作用域了.

  通过上面的介绍知道了关系之后,就很容易从一个页面更新到其他通过window.open或者iframe嵌套的子页面或者父页面了。

  备注:chrome浏览器下本地测试iframe不能互访,chrome浏览器iframe parent.document为undefined.

  测试脚本的时候发现,在谷歌chrome浏览器下面,iframe中获取父页的document时竟然为undefined,google chrome神奇了,其他浏览器如ie,firefox没出现这种问题。

  iframe要获取到父页的document对象,需要通过服务器,就是http协议访问时才能获取到,要不直接双击运行【chrome为默认浏览器】或者直接拖进chrome浏览器查看时,iframe使用parent.document得到的是undefined。

测试代码:

test.html

 <html>
<head></head>
<body><input type="text" id="txt" />
<br />
<iframe src="ifr.html"></iframe></body>
</html>

ifr.html

 <input type="button" onclick="setValue()" value="设置父页输入框内容" />
<script>
function setValue() {
alert(parent.document)  //非http协议访问输出undefined,http协议访问时输出[object HTMLDocument]
var ipt = parent.document.getElementById('txt');  //本地浏览由于parent.document为undefined,所以当然无法使用getElementById方法了
ipt.value = new Date().toLocaleString();
}
</script>

EOM

原文转自编程设计网,文章所有权,解释权归原作者。

Lionden 2015年8月9日

E-mail:hsdlionden@hotmail.com

转载请注明原文地址和博客园Liondenhttp://www.cnblogs.com/lionden/

【转】iframe和父页,window.open打开页面之间的引用的更多相关文章

  1. 点击按钮使用window.open打开页面后,再次点击按钮会再打开一个页面,如何解决?

    点击按钮使用window.open打开页面后,再次点击按钮会再打开一个页面,如何解决? window.open("page1.html","win1"); 这句 ...

  2. Vue-cli 2.9 多页配置及多页面之间的跳转问题

    vue开发,现在大部分做的都是(SPA)应用,但是,由于,需求不同,我们针对的用户需求变更较为,频繁,如果每次都全量打包更新,给开发的自测,及测试妹子的任务就会多,每次都要重新验证一下才放心.所以,想 ...

  3. window.open()打开页面

    一.window.open()支持环境:JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+ 二.基本语法:window.open(pageURL,name,pa ...

  4. iframe父页调子页和子页调父页方法

    子页调用父页 window.parent.myChart.resize(); 父页调用子页 $("iframe")[0].contentWindow.myChart.resize( ...

  5. iframe 和 父窗口传递

    iframe 向父窗口 window.parent.postMessage('向父窗口传递值',*); 父窗口向 iframe 内部子窗口传值 documnet.querySelector('ifra ...

  6. window.open打开新窗口 参数

    1,基本描述 oNewWindow = window.open( sURL , sName , sFeatures, bReplace) window.open在打开一个窗口(其url为sURL)后, ...

  7. 父<IFRAME>获取子页属性以及子页中<IFRAME>的方法

    例子如下: 1.父页index.jsp <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "ht ...

  8. 高并发分布式系统中生成全局唯一(订单号)Id js返回上一页并刷新、返回上一页、自动刷新页面 父页面操作嵌套iframe子页面的HTML标签元素 .net判断System.Data.DataRow中是否包含某列 .Net使用system.Security.Cryptography.RNGCryptoServiceProvider类与System.Random类生成随机数

    高并发分布式系统中生成全局唯一(订单号)Id   1.GUID数据因毫无规律可言造成索引效率低下,影响了系统的性能,那么通过组合的方式,保留GUID的10个字节,用另6个字节表示GUID生成的时间(D ...

  9. HTML:模拟链接被按下,在新标签页打开页面,不使用window.open(可能被拦截)

    当按下一个按钮时,想打开一个新的标签页,可以使用window.open去实现但是因为使用window.open在新窗口或者新标签页中打开页面,有可能被浏览器给拦截.为了解决这个问题,可以模拟链接被按下 ...

随机推荐

  1. Objective-C 对象(内容根据iOS编程编写)

    开发iOS程序需要使用 Objective-C 语言和Cocoa Touch框架.Objective-C 源于 C 语言,是 C 语言的扩展. Cocoa Touch框架是一个Objective-C类 ...

  2. 优化MySchool数据库设计

    第一章 数据库的设计 1.E-R图中: 矩形:实体 椭圆:属性 菱形:关系 直线:连接实体,属性和关系 2.映射基数 一对多 多对一 多对多 3.范式: 第一范式:确保每列的原子性 第二范式:确保表中 ...

  3. android应用开发(十):widget的使用

    1.自定义widget必须继承AppWidgetProvider 源码:http://www.jinhusns.com/Products/Download/?type=xcj 2.AndroidMan ...

  4. Concurrency in csharp (Asynchronous, Parallel, and Multithreaded Programming)

    http://stephencleary.com/projects/ /// <summary> /// /// </summary> public partial class ...

  5. poj2186--tarjan+缩点

    题目大意:       每一头牛的愿望就是变成一头最受欢迎的牛.现在有N头牛,给你M对整数(A,B),表示牛A认为牛B受欢迎. 这 种关系是具有传递性的,如果A认为B受欢迎,B认为C受欢迎,那么牛A也 ...

  6. Java字节、十进制、十六进制、字符串之间的相互转换

    1. 字节转10进制 直接使用(int)类型转换. /* * 字节转10进制 */ public static int byte2Int(byte b){ int r = (int) b; retur ...

  7. 错误:下列软件包有未满足的依赖关系: openssh-server : 依赖: openssh-client (= 1:7.1p1-4)

    解决办法:尝试了很久才解决,这个是我发现最有用的,完美的解决了我的困难 后续过程参考:http://blog.csdn.net/jszhangyili/article/details/8881807 ...

  8. virtualbox 虚拟机Ubuntu 传文件-共享

  9. 【夯实PHP系列】PHP正则表达式

    一. 概述 1. 正则表达式的测试地址: http://tool.chinaz.com/regex/ 二.具体的常用正则表达式 1. 邮箱正则表达式: 1)\w[-\w.+]*@([A-Za-z0-9 ...

  10. AMD and CMD are dead之KMDjs内核之分号

    在老版本的kmdjs中,强制了分号的要求.但是总感觉不爽,因为在开发Ket - Kmdjs Extension Tools的时候,总需要导入一些开源的库,然后痛苦就来了,总是报错,一查,就是缺少分号! ...