1.在应用iframe或者frameset的时候

  parent指的是父窗口。top指的是顶级的窗口。self指的是当前的窗口-window

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>

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

2.在同一个页面中,使用js获取另一个iframe中的dom元素

  

parent.html

        <iframe id="myframe" name="myframe" src="http://localhost:888/child.html" frameborder="3" style="width:300;height:200;">
</iframe>
<iframe id="myframe0" src="http://localhost:888/child0.html" frameborder="3" style="width:300;height:200;" name="if2">
</iframe> <script>
function init() {
var obj1 = document.getElementById("myframe");
console.log(obj1.src);
//alert(obj1.window.document.myform.username.value);//错误 var obj2 = document.frames("myframe"); //获取报错
console.log(obj2.window.document.myform.username.value);
//alert(obj2.src);//错误
}
init()
</script>

  

child0.html
child0
<div id="child0">123</div>

  

child.html
<form name="myform">
用户名:
<input type="text" name="username" value="test" />
</form>
<script>
console.log(parent.frames['if2'].document.getElementById("child0"))
var b = window.top != window.self;
document.write("当前窗口是否在一个框架中:" + b);
</script>

  

js中top、self、parent的更多相关文章

  1. js中 opener和parent的差别

    opener即谁打开我的,比方A页面利用window.open弹出了B页面窗体.那么A页面所在窗体就是B页面的opener.在B页面通过opener对象能够訪问A页面. parent表示父窗体,比方一 ...

  2. 【转】Js中的window.parent ,window.top,window.self 详解

    [转自]http://blog.csdn.net/zdwzzu2006/article/details/6047632 在应用有frameset或者iframe的页面时,parent是父窗口,top是 ...

  3. Js中的window.parent ,window.top,window.self 详解

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

  4. Js中的window.parent ,window.top,window.self ,window.openner详解

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

  5. Js中的window.parent ,window.top,window.self详解

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

  6. Js中的window.parent ,window.top,window.self 了解

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

  7. js中top.location.href、parent.location.href用法

    window.location.href.location.href是本页面跳转 parent.location.href是上一层页面跳转 top.location.href是最外层的页面跳转 举例说 ...

  8. js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版【转】

    之前在修改IE6下的一个显示bug时,查到过这些,贴这备忘,后面给出了详细说明,以前的版本,没仔细的说明,特希望大家也收藏下.   网页可见区域宽: document.body.clientWidth ...

  9. js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版

    网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...

随机推荐

  1. Android系统启动过程[典☆☆☆]

    Android系统启动过程 首先Android框架架构图:(来自网上,我觉得这张图看起来很清晰) Linux内核启动之后就到Android Init进程,进而启动Android相关的服务和应用. 启动 ...

  2. RabbitMQ 安装使用教程

    环境 CentOS7 + Python3.5 yum -y install epel-release erlang socat cd /usr/local/src wget http://www.ra ...

  3. mvn设置

    mvn仓库网址: https://mvnrepository.com 安装好maven后,一定要确认安装路径下的setting.xml与本地仓库中的setting.xml一致. 坐标: 什么是坐标? ...

  4. centos下利用mail命令进行邮件发送

    centos下默认自带mail命令: 可以用如下命令查看存放位置: which mail 结果如下: 如果没有安装可以使用 如下命令安装 yum -y install mailx 利用mail命令进行 ...

  5. 洛谷 P2015 二叉苹果树(codevs5565) 树形dp入门

    dp这一方面的题我都不是很会,所以来练(xue)习(xi),大概把这题弄懂了. 树形dp就是在原本线性上dp改成了在 '树' 这个数据结构上dp. 一般来说,树形dp利用dfs在回溯时进行更新,使用儿 ...

  6. PHP闭包 function() use(){}

    php的闭包(Closure)也就是匿名函数.是PHP5.3引入的. 闭包的语法很简单,需要注意的关键字就只有use,use意思是连接闭包和外界变量. $a =function()use($b) { ...

  7. java23种设计模式之二: 单例设计模式(6种写法)

    目的:在某些业务场景中,我们需要某个类的实例对象的只能有一个,因此我们需要创建一些单例对象. 本文共有6种写法,仅供参考 1.饿汉式 优点: 在多线程情况下,该方法创建的单例是线程安全的(立即加载) ...

  8. docker教程目录

    为什么要用 Docker 什么是 Docker Docker 镜像 Docker容器的运用 Docker仓库 Docker如何获取镜像 CentOS 安装Docker Docker 列出镜像 Dock ...

  9. Memcached stats sizes 命令

    Memcached stats sizes 命令用于显示所有item的大小和个数. 该信息返回两列,第一列是 item 的大小,第二列是 item 的个数. 语法: stats sizes 命令的基本 ...

  10. 分享几道Java线程面试题

    不管你是新程序员还是老手,你一定在面试中遇到过有关线程的问题.Java语言一个重要的特点就是内置了对并发的支持,让Java大受企业和程序员的欢迎.大多数待遇丰厚的Java开发职位都要求开发者精通多线程 ...