JavaScript中 window.parent 、window.top、window.self代表的含义

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

      在项目中,有如下应用场景,原本在右侧iframe中引入对话框js类,对话框能出来但是只能在右侧iframe中移动,不能在整个页面内移动。

     解决如下:

     将对话框js类引入到最外层jsp中,然后在原调用出,使用

new window.top.SGS.UI.Control.CommDialog();
window.top.document.body.appendChild(_dialog.divObj);

此次window.top是最顶级父窗口含义。

下面实例:

top作用是取得最顶层框架对象

A.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>prototype test</title>
</head>
<body>
<iframe src="b.html"></iframe>
<script language="javascript">
var topstr = "my top";
    alert(a.html=‘+top.location.href);
</script>

</body>
</html>

B.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>prototype test</title>
</head>
<body>
<iframe src="c.html"></iframe>

<script language="javascript">
alert(‘b.html=‘+top.location.href+";a.html.topstr="+top.topstr);//top.topstr可取a.html(顶层框架参数)的topstr变量
</script>
</body>
</html>

C.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>prototype test</title>
</head>
<body>

<script language="javascript">
alert(‘c.html=‘+top.location.href+";a.html.topstr="+top.topstr);//top.topstr可取a.html(顶层框架参数)的topstr变量
</script>
</body>
</html>

b.html中的top=parent c.html中的top=parent.parent

 

<摘自:http://wangpj.iteye.com/blog/853395 & http://blog.csdn.net/good_youth/article/details/2079416>

时间: 2024-08-28 05:12:59

JavaScript中 window.parent 、window.top、window.self代表的含义的相关文章

(window,parent,opener,top).location.reload方法汇总

最近项目是和某度合作,集成他们一个功能到我们产品上.由于是中途从同事手中接过来的活,并且第一次使用jsonp,不熟悉页面的刷新跳转,遭坑惨了,现在来记录下这个情况,希望给有类似需求的同志带来些许帮助. 情景描述: 登陆login.html页面登陆验证成功后,跳转到index.html页面,index.html页面加载完成后就要发送jsonp请求到对方服务器得到想应的数据并展示出来,如若没有登陆某度的帐户,弹出提示信息.然后需要点击页面的登陆按钮,弹出某度的登陆框(iframe引入),登陆某度成功

js代码中的parent,top和self有什么区别

1.parent常用在iframe和frame中的子页面访问父页面中的对象 2.top :一个页面可能会有很多层,top是指最顶层的框架 3.self :是指当前窗口

JavaScript中七种函数调用方式及对应 this 的含义

http://blog.sina.com.cn/s/blog_621f1e120100rj21.html this 在 JavaScript 开发中占有相当重要的地位,不过很多人对this这个东西都感觉到琢磨不透.要真正理解JavaScript的函数机制,就非常有必要搞清楚this到底是怎么回事. 函数调用方式不同,this 含义也跟着不同.JavaScript语言中有七种调用函数方式: 第一种:调用方法var obj = {    method: function() { alert(this

Android 布局文件中的values-v11,values-v14,values-v19代表的含义

对于初学者而言,有时候看到项目中会有values-v11,values-v14,values-v19等文件夹,里面有dimens,styles等.那具体代表是什么呢?我从2.3时代开始接触android,突然有一天到了4.0以上系统,我发现多了v14等文件夹,之后才明白跟android 的api版本有关系. values-v11代表在API 11+的设备上,用该目录下的styles.xml代替res/values/styles.xml values-v14代表在API 14+的设备上,用该目录下

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,利用的javascri

window.parent != window 解决界面嵌套问题

页面在被嵌套的时,效果:,,如果用户点击“刷新”,该问题即可解决. 如果想通过代码解决的话,这个问题属于客户端的问题,不是服务器端的问题. 如果直接写:window.location.href = “***”的时候,只要一显示界面就刷新界面,系统将进入死循环状态.想要的效果是:只有界面被嵌套的时候才希望被刷新. window.parent指的是小窗口的大窗口 window.parent.location.href = window.location.href:使窗口等于当前小窗口的界面 解决问题

【转】深入浅出 JavaScript 中的 this

Java 等面向对象的语言中,this 关键字的含义是明确且具体的,即指代当前对象.一般在编译期确定下来,或称为编译期绑定.而在 JavaScript 中,this 是动态绑定,或称为运行期绑定的,这就导致 JavaScript 中的 this 关键字有能力具备多重含义,带来灵活性的同时,也为初学者带来不少困惑.本文仅就这一问题展开讨论,阅罢本文,读者若能正确回答 JavaScript 中的 What ’s this 问题,作为作者,我就会觉得花费这么多功夫,撰写这样一篇文章是值得的. Java

深入浅出 JavaScript 中的 this

本文来自:http://www.ibm.com/developerworks/cn/web/1207_wangqf_jsthis/ JavaScript 语言中的 this 由于其运行期绑定的特性,JavaScript 中的 this 含义要丰富得多,它可以是全局对象.当前对象或者任意对象,这完全取决于函数的调用方式.JavaScript 中函数的调用有以下几种方式:作为对象方法调用,作为函数调用,作为构造函数调用,和使用 apply 或 call 调用.下面我们将按照调用方式的不同,分别讨论

JavaScript中继承的实现方法--详解

最近看<JavaScript王者归来>中关于实现继承的方法,做了一些小总结: JavaScript中要实现继承,其实就是实现三层含义:1.子类的实例可以共享父类的方法:2.子类可以覆盖父类的方法或者扩展新的方法:3.子类和父类都是子类实例的“类型”. JavaScript中,并不直接从语法上支持继承,但是可以通过模拟的方法来实现继承,以下是关于实现继承的几种方法的总结:1.构造继承法2.原型继承法3.实例继承法4.拷贝继承法 1.构造继承法:在子类中执行父类的构造函数. 1<SCRIPT

Javascript 中的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 注:如果窗