window.parent ,window.top,window.self 详解及parent和opener的区别

简介: window.parent ,window.top,window.self 详解   在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法打开当前窗口的那个窗口。

window.parent ,window.top,window.self 详解

 

 

 

在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法打开当前窗口的那个窗口。

 

window.self

 

功能:是对当前窗口自身的引用。它和window属性是等价的。

语法:window.self

注:window、self、window.self是等价的。

 

window.top

功能:返回顶层窗口,即浏览器窗口。

语法:window.top

注:如果窗口本身就是顶层窗口,top属性返回的是对自身的引用。

 

 

window.parent

功能:返回父窗口。

语法:window.parent

注:如果窗口本身是顶层窗口,parent属性返回的是对自身的引用。

在框架网页中,一般父窗口就是顶层窗口,但如果框架中还有框架,父窗口和顶层窗口就不一定相同了。

 

判断当前窗口是否在一个框架中:

<script type="text/javascript">
var b = window.top!=window.self;
document.write( "当前窗口是否在一个框架中:"+b );
</script>

你应当将框架视为窗口中的不同区域,框架是浏览器窗口中特定的部分。一个浏览器窗口可以根据你的需要分成任意多的框架,一个单个的框架也可以分成其它多个框架,即所谓的嵌套框架。

 

 

js中opener和parent的区别

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错误。

 


<html>
<body>
<form. name=form1>
<input type=text name=inpu >
<input type=button
>
</form>
</body>
</html>
--------------------------------
back2opener.html
--------------------------------
<html>
<body>
<form. name=form1>
<input type=text name=inpu >

<a class="under" href=# >添加</a>
</form>
</body>
</htmlwindow.opener 返回的是创建当前窗口的那个窗口的引用,比如点击了a.htm上的一个链接而打开了b.htm,然后我们打算在b.htm上输入一个值然后赋予a.htm上的一个id为“name”的textbox中,就可以

写为:
window.opener.document.getElementByIdx_x_x("name").value = "输入的数据";
============================================
常见的误区:
父页面
window.open( 'open.jsp?City= '+strCity, ' ', 'width=252,   height=100,   scrollbars=no ');
子页面open.jsp
window.parent.maplet.clean();
报错为window.parent.maplet为空或不是对象!
什么原因呢?别的没有问题!
错误原因:
window.parent   表示当前框架的父框架,
如果子窗口不在框架中,那么就为空,
不是表示子窗口和父窗口的关系,
是框架之间的关系。
如果子窗口不在框架中,即通过A.html的一个链接打开的 B.html页面,在B.html引用A.html的表单元素时,可以这样写:
window.opener.document.formname.maplet
其中formname是你父窗口中form的名字

目录
相关文章
|
3月前
|
JavaScript
原生js中offsetTop, offsetLeft与offsetParent的详细讲解
原生js中offsetTop, offsetLeft与offsetParent的详细讲解
|
4月前
|
JavaScript
Can‘t get DOM width or height. Please check dom.clientWidth and dom.clientHeight. They should not be
Can‘t get DOM width or height. Please check dom.clientWidth and dom.clientHeight. They should not be
183 0
|
5月前
window.location对象使用
window.location对象使用
25 0
|
前端开发
前端 window 和 window.location
前端 window 和 window.location
前端 window 和 window.location
|
编解码
怎么解决 ie 中获取 window.screen.width 不正确?
怎么解决 ie 中获取 window.screen.width 不正确?
99 0
怎么解决 ie 中获取 window.screen.width 不正确?
|
JavaScript 前端开发
18、DOM对象(window、screen、location、history、navigation)
18、DOM对象(window、screen、location、history、navigation)
96 0
为什么会有window.window这种设计
为啥要搞这个这个看起来貌似很奇葩的设计。 要解答这个问题,还得请出this,我们经常说浏览器中的全局对象是window, 这句话对了,也还没完全对。 全局对象的真实身份应该是全局作用域的this。 window只是为了便于访问this,弄出来的一个属性。
271 0
为什么会有window.window这种设计
|
编解码
window.innerHeight window.outerHeight 与screen.height
本文目录 1. window 2. innerHeight与outerHeight 3. screen.height 4. 实例
336 0
window.innerHeight window.outerHeight 与screen.height
|
JavaScript
JS中window的parent和opener对象
JS中window的parent和opener对象
152 0