今天我都在怀疑，很多项目还用不用iframe这个框架做页面布局。

如果你有兴趣想告诉我，请给我留言。

一. 说明

注：这里top和window.top等价，window是可以省略的，有得情况下不允许省略，如：
 function func(){

　　var top=100;

　　var tWin=window.top;

}

window和self都表示当前窗口本身；

top是最顶层的window

parent是上级window

opener是打开当前窗口的window

二.举个栗子

以下是a.html的主要html：

<body>

　　<iframe id="frm" ... src="b.html"></iframe>

　　<script>

　　　　var t="A页面";   //这个是A页面中window对象的一个属性，和window.t='A页面'等级

　　</script>

</body>

以下是b.html的主要html脚本：

<body>

　　<script>

　　　　function showWin(){

　　　　　　window.open("c.html");

　　　　}

　　　　var t="B页面";

　　</script>

　　<iframe id="frm" ....src="c.html"></iframe>

　　<input type="button" value="..." onclick="showWin()" />

</body>

以下是c.html的主要html脚本：

<body>

　　<script>

　　　　var t="C页面";

　　　　alert(window.t);

　　　　alert(self.t);

　　　　alert(top.t);

　　　　alert(parent.t);

　　　　alert(opener.t);

　　</script>

</body>

按照以上的设计，运行a.html页面，会弹出以下信息：

// C页面；

// C页面；

// A页面；

// B页面；

// 页面脚本报错，提示opener.t为空或不是对象；

点击b.html页面上的按钮，弹出c.html页面，页面弹出信息除了最后一个，其他的都和上面一样：

// C页面；

// C页面；

// A页面；

// B页面；

// B页面；--------- 只有这个不一样，以为是C页面是被B页面打开的

基础之 window-self-top-opener的更多相关文章

  1. js 对象 window,parent,top,opener,document

    Js 对象 window top parentWindow 当前html 页面Parent 当前html 页面的父页面Top 当前html页面的祖页面Window ==parent = top 当前页 ...

  2. html中window对象top 、self 、parent 等属性

    window对象用法: http://www.w3school.com.cn/htmldom/dom_obj_window.asp top 属性返回最顶层的先辈窗口. 该属性返回对一个顶级窗口的只读引 ...

  3. js中window对象的opener属性的一个坑

    2018-05-08 17:48:33 今天我编写代码碰到了一个让我纠结了很久的坑,特别想在此说一下,让其他人避免我踏过的这个坑. 这个坑就是:在我自己写的子窗口中用opener属性却获取不到父窗口的 ...

  4. Python3 tkinter基础 Text window 文本框中插入按钮

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  5. UI基础:UIView(window,frame,UIColor,CGPoint,alpha,CGRect等) 分类： iOS学习-UI 2015-06-30 20:01 119人阅读 评论(0) 收藏

    UIView 视图类,视图都是UIView或者UIView子类 UIWindow 窗口类,用于展示视图,视图一定要添加window才能显示 注意:一般来说,一个应用只有一个window 创建一个UIW ...

  6. Android 环境搭建、基础窗口window／Mac

    1.五步搞定Android开发环境部署--非常详细的Android开发环境搭建教程 2.Android开发学习之路--MAC下Android Studio开发环境搭建 4.Android常用开发工具以 ...

  7. linux 基础 复制window文件到linux

    1.下载pscp工具:地址 2.dos执行命令: pscp F:\his.rar root@192.168.3.137:/tmp/test

  8. Java Script 基础

    一. JS的简介 JavaScript是一种网页编程技术,经常用于创建动态交互网页 JavaScript是一种基于对象和事件驱动的解释性脚本语言,类似C语言和Java的语法 事先不编译:逐行执行:无需 ...

  9. JavaScript基础入门07

    目录 JavaScript 基础入门07 BOM window对象 Navigator对象 Screen 对象 Location对象 History 对象 JavaScript 基础入门07 BOM ...

  10. window.parent与window.openner区别介绍

    今天总结一下js中几个对象的区别和用法: 首先来说说 parent.window与top.window的用法 "window.location.href"."locati ...

随机推荐

  1. bzoj2893

    有起点终点的限制的路径覆盖首先tarjan缩点成DAG似乎不能按照二分匹配的做法做那么建立源汇拆点i,i',这两点之间连一条下界为1上界无穷的边,其它边都是下界为0,上界正无穷然后就是有源有汇的最小流 ...

  2. 【Bower】

    Bower Bower:客户端库管理工具 Day 1: Bower —— 管理你的客户端依赖关系 bower解决js的依赖管理

  3. HDU 5935 Car 【模拟】 （2016年中国大学生程序设计竞赛（杭州））

    Car Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submiss ...

  4. Ext.form.FormPanel定义的参数说明

    1.formId : String (可选的)FORM标签的id(默认是自动生成的). 2.labelWidth : Number 标签的宽度.该属性级联于子容器. 3. itemCls : Stri ...

  5. 《C语言程序设计现代方法》第3章 格式化输入/输出

    完整的细节将留到第22章中介绍. 调用printf函数一次可以打印的值的个数没有限制. 注意:C语言编译器不会检查格式串中转换说明的数量是否和输出项的数量相互匹配,也不会检查转换说明是否适合要显示项的 ...

  6. linearizing the depth in vertex shader

    please refer to http://www.mvps.org/directx/articles/linear_z/linearz.htm When using a programmable ...

  7. uva 3523 Knights of the Round Table

    题意:给你n,m n为有多少人,m为有多少组关系,每组关系代表两人相互憎恨,问有多少个骑士不能参加任何一个会议. 白书算法指南 对于每个双联通分量,若不是二分图,就把里面的节点标记 #include ...

  8. js的 new image()用法[转]

    创建一个Image对象:var a=new Image();    定义Image对象的src: a.src=”xxx.gif”;    这样做就相当于给浏览器缓存了一张图片. 图像对象: 建立图像对 ...

  9. 将多个Sheet导入到同一个Excel文件中

    实体类excel import java.util.List; /** * 功能: * 描述: * @author * @date 2015-3-19 下午5:15:48 */ public clas ...

  10. （转载）反编译android的apk文件步骤

    下面的方法我已经尝试过,完全可以成功,重点的步骤我在这里说一下 1.必须要有java环境,记得配置好环境变量 2.如果只查看class中的函数文件,只需要下载dex2jar和jd-gui 3.下载地址 ...