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. JS等比例缩放图片,限定最大宽度和最大高度

    JS等比例缩放图片,限定最大宽度和最大高度 JavaScript //图片按比例缩放 var flag=false; function DrawImage(ImgD,iwidth,iheight){ ...

  2. centos7安装kvm环境采用网桥模式并创建虚拟机制作openstack需要的镜像

    初始环境的安装:centos7 mini iso镜像进行安装的系统 采用的环境是vm该软件,联网方式NAT模式下配置的静态ip(如何在NAT模式下配置静态ip参考之前的文章) 1.由于要安装kvm环境 ...

  3. 20145328 《Java程序设计》第8周学习总结

    20145328 <Java程序设计>第8周学习总结 教材学习内容总结 第十四章 NIO与NIO2 NIO使用频道(channel)来衔接数据节点,对数据区的标记提供了clear(),re ...

  4. 20145109 实验四 Andoid开发基础

    安装Android 打开 默认程序中有helloworld 按下下图红框中的键: 遇到问题: 方法:修改build.gradle

  5. LeetCode——Nth Digit

    Question Find the nth digit of the infinite integer sequence 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, ... ...

  6. git-svn — 让git和svn协同工作

     git-svn — 让git和svn协同工作 svn作为一个优秀源码版本的管理工具,可以适合绝大多数项目.但是因为它的采用中心化管理,不可避免的存在本地代码的备份和版本管理问题.也就是说对于尚未或暂 ...

  7. PHP返回32位与16位的md5加密值

    字符串“123456”,经过md5算法加密之后是 32位: e10adc3949ba59abbe56e057f20f883e16位: 49ba59abbe56e057 PHP自带的 md5() 函数, ...

  8. activiti如何让业务对象和对应的流程关联

    如何让业务对象和对应的流程 关联? 发现ProcessInstance 有个方法getBusinessKey()可以得到一个businessKey. ProcessInstance 对应数据库中的表a ...

  9. MVC 后台调用JS

    示例控制器: public ActionResult Index()        {            ViewBag.js = "<script type='text/java ...

  10. 转载:Javascript面向对象编程原理 -- 理解对象

    源地址:http://www.html-js.com/article/1717 虽然JavaScript中已经自带了很多内建引用类型,你还是会很频繁的需要创建自己的对象.JavaScript编程的很大 ...