Javascript中window.opener的一点小总结
以前一直认为window.opener只有在window.open方法打开下的窗口才可以访问,没想到即使是a链接打开的页面的照样可以访问。window.opener指向父窗口,也就是来源窗口。可以利用window.opener获取来源页面location.href信息等,也可以操作来源 页面的DOM,十分强大
但下面的情况,window.opener的值为null
1,跨域的情况
如果是www.a.com/1.html链接到www.b.com/2.html,这种情况会丢失
2,利用的javascript对location的操作
比如1.html页面是通过location.href=”2.html”跳转到2.html的,在2.html的window.opener也是null,无法获取
3,利用浏览器的拖拽功能
现在的浏览器基本都是支持多tab浏览了,如果是利用拖拽链接的tab,在新tab的网页中也是无法获取window.opener
在JS中,window.opener只是对弹出窗口的母窗口的一个引用。比如:
a.html中,通过点击按钮等方式window.open出一个新的窗口b.html。那么在b.html中,就可以通过window.opener(省略写为opener)来引用a.html,包括a.html的document等对象,操作a.html的内容。
假如这个引用失败,那么将返回null。所以在调用opener的对象前,要先判断对象是否为null,否则会出现“对象为空或者不存在”的JS错误。
补充一下关于window.opener与js window.parent差异
window.parent和window.opener区别来讲的,我们如果要用到iframe的值传到另一框架就要用到 :
| 代码如下 | 复制代码 |
| window.opener.document.getElementById(name).value = uvalue; | |
这种形式哦。
window.parent能获取一个框架的父窗口或父框架。顶层窗口的parent引用的是它本身。
可以用这一点特性来判断这个窗口是否是顶层窗口。如:
| 代码如下 | 复制代码 |
|
function IsTopWindow( win ) |
|
window.opener引用的是window.open打开的页面的父页面。
opener即谁打开我的,比如A页面利用window.open弹出了B页面窗口,那么A页面所在窗口就是B页面的opener,在B页面通过opener对象可以访问A页面。
parent表示父窗口,比如一个A页面利用iframe或frame调用B页面,那么A页面所在窗口就是B页面的parent。
在JS中,window.opener只是对弹出窗口的母窗口的一个引用。比如:
a.html中,通过点击按钮等方式window.open出一个新的窗口b.html。那么在b.html中,就可以通过 window.opener(省略写为opener)来引用a.html,包括a.html的document等对象,操作a.html的内容。假如这个引用失败,那么将返回null。所以在调用opener的对象前,要先判断对象是否为null,否则会出现“对象为空或者不存在”的JS错误。
window.opener 返回的是创建当前窗口的那个窗口的引用,比如点击了a.htm上的一个链接而打开了b.htm,然后我们打算在b.htm上输入一个值然后赋予a.htm上的一个id为“name”的textbox中,就可以写为:
| 代码如下 | 复制代码 |
|
window.opener.document.getElementById("name").value = "输入的数据"; |
|
关于JS跨域刷新父页面的问题
实现一个小功能,父页面弹出窗口里加载不同域的子页面,操作结束之后关闭弹出窗口并刷新父页面,首先想到的实现方式:
- window.parent.opener.loaction.reload();
- window.parent.close();
经测试发现window.parent.opener.location取不到对象,无法执行reload()
修改为:
- try{
- window.parent.opener.location.reload();
- window.parent.close();
- }catch(e){
- window.parent.opener.location = "父页面地址";
- window.parent.opener = null;
- window.parent.close();
- }
服务器跨域的时候,两个页面不在同一个服务器,子页面无法获取到父页面的location,所以我们需要手动设置父页面,这样也能达到刷新父页面的效果
参考文章:
http://www.cnblogs.com/aming/archive/2008/11/03/1325197.html
Javascript中window.opener的一点小总结的更多相关文章
- 【前端】javascript中10常用的个小技巧总结
javascript中10常用的个小技巧总结 本文转自:http://www.cnblogs.com/libin-1/p/6756393.html 1. new Set() 可能有人知道ES6中提供了 ...
- javascript中window,document,body的解释
解释javascript中window,document,body的区别: window对象表示浏览器中打开的窗口,即是一个浏览器窗口只有一个window对象. document对象是载入浏览器的ht ...
- XSS传染基础——JavaScript中的opener、iframe
最近研究XSS,根据etherDream大神的博客 延长XSS生命周期 写了一个子页面父页面相互修改的demo. 一. 子页面.父页面相互修改——window.opener.window.open 在 ...
- javascript中window与document对象、setInterval与setTimeout定时器的用法与区别
一.写在前面 本人前端菜鸟一枚,学习前端不久,学习过程中有很多概念.定义在使用时容易混淆,在此给向我一样刚踏入前端之门的童鞋们归纳一下.今天给大家分享一下js中window与document对象.se ...
- javascript中window对象 部分操作
<!--引用javascript外部脚本--> <script src="ss.js"></script> <script> //警 ...
- javascript中window.open()与window.location.href
1.window.location是window对象的属性,而window.open是window对象的方法 window.location是你对当前浏览器窗口的URL地址对象的参考! ...
- JavaScript中 window.parent 、window.top、window.self代表的含义
在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法 ...
- 一些JavaScript中的DOM的优化小技巧
在进行DOM优化时需要关注的问题有:修改DOM的时候,会引起页面的重排,重绘.因为JS是单线程执行的,那么在重排重绘的过程中可能会阻塞用户的操作.为了更好的用户体验,必须要严格控制这些操作. 一.对象 ...
- javascript中window.open()与window.location.href的区别
window.open("www.baidu.com"); 只是表示打开这个页面,并不是打开并刷新baidu.com window.location.href="www. ...
随机推荐
- Android开发利用Volley框架下载和缓存网络图片
2013年Google I/O大会上推出了一种新的网络通信框架——Volley,Volley可是说是把AsyncHttpClient和Universal-Image-Loader的优点集于了一身,既可 ...
- 【mysql】mysql查询 A表B表 1对多 统计A表对应B表中如果有对应,则返回true否则false作为A表查询结果返回
A表:goods_type B表:brand_config A:B = 1:N 一种商品类型 对应多条 品牌配置 ======================================== 需求 ...
- Flume的安装配置
flume是一个分布式.可靠.和高可用的海量日志采集.聚合和传输的系统.支持在日志系统中定制各类数据发送方,用于收集数据;同时,Flume提供对数据进行简单处理,并写到各种数据接受方(比如文本.HDF ...
- C语言宏定义和宏定义函数
要写好C语言,漂亮的宏定义是非常重要的.宏定义可以帮助我们防止出错,提高代码的可移植性和可读性等. 在软件开发过程中,经常有一些常用或者通用的功能或者代码段,这些功能既可以写成函数,也可以封装成为宏定 ...
- Linux C 网络编程 - 获取本地 ip 地址,mac,通过域名获取对应的 ip
获取本地 ip 地址,mac,通过域名获取对应的 ip, 是网络编程可能遇到的比较常见的操作了,所以总结如下(封装了3个函数), 直接上代码: #include <stdio.h> #in ...
- 对于Ian的访谈,不少关于GAN的内容
文章链接如下: http://3g.163.com/dy/article/DD1GBSLF0511ABV6.html 里面提到胶囊网络,我找了这篇文章看了下: https://blog.csdn.ne ...
- django 基础知识回顾
内容回顾: 1. ajax参数 url: type: data: 1.value不能是字典 {k1:'v1',k2:[1,2,3,],k3; JSON.string} 2.$('').serilize ...
- 用 Git Hooks 进行自动部署
原文发表于 http://ourai.ws/posts/deployment-with-git-hooks/ 昨天开始接手开发公司前端团队的主页,在稍微修改点东西后推送到远程仓库想看下线上结果时发现并 ...
- MapReduce中的分布式缓存使用
MapReduce中的分布式缓存使用 @(Hadoop) 简介 DistributedCache是Hadoop为MapReduce框架提供的一种分布式缓存机制,它会将需要缓存的文件分发到各个执行任务的 ...
- [Algorithm] Dynamic programming: Find Sets Of Numbers That Add Up To 16
For a given array, we try to find set of pair which sums up as the given target number. For example, ...