HTML5技术

窗口、窗体之间的关系 - 苏服

字号+ 作者:H5之家 来源:博客园 2016-07-29 18:00 我要评论( )

窗口、窗体之间的关系: 通过window.open()创建的新窗口的Window对象具有opener属性,可以通过opener打开它的原始窗口,这样两个窗口之间就可以相互引用,彼此之间可以读取对方的属性方法,而窗体也是一样。 窗体是由iframe创建的,该元素有contentWindow属

窗口、窗体之间的关系:

      通过window.open()创建的新窗口的Window对象具有opener属性,可以通过opener打开它的原始窗口,这样两个窗口之间就可以相互引用,彼此之间可以读取对方的属性方法,而窗体也是一样。

        窗体是由<iframe>创建的,该元素有contentWindow属性,它引用自身的Window对象,而Window对象有frameElement属性,若该Window对象表示一个窗体,则frameElement是对<Iframe>元素的引用,如:对于元素<iframe id = 'f1'>,

        var elt = document.getElementById('f1');

        var win = elt.contentWindow;

        win.frameElement === elt; //true

        window.frameElement === elt; //false 对于顶级窗口来说永远是false

        每个Window对象都有一个frames属性,包括窗体和子窗体。frames属性引用了它所包含的窗体和子窗体的Window对象,frames是由这些Window对象组成的类数组对象,可通过数字或窗体名来进行索引,如引用第一个子窗体frames[0],引用第二个子窗体的第三个子窗体frames[1].frames[2],引用兄弟窗体parent.frames[1]。

        内置对象在不同的窗口、窗体之间是相互独立的,它们有自己的一份独立的构造函数和原型对象的副本,它会在所有窗口窗体内自动预定义;而自定义对象则不同,可以在能够相互通信的窗口、窗体之间共享这个对象的构造函数和它的原型;如窗口中定义了Set类,有子窗体A和B,则:

        在父窗口中 :

                var s = new Set(); String.toString = function(){return '内置对象';} (修改String的toString方法)

                s.a === 1; //true

        在A中 :

                var sa = new parent.Set(); parent.Set.prototype.a =1; (给自定义类Set的原型添加属性a,则所有能相互通信的窗口共享a)

                var str = '测试';  str.toString; //测试  (调用的是窗体A自身的String对象的toString方法)

        在B中 :

                var Set = top.Set(); var sb = new Set(); sb.a === 1;  //true

 

要引用窗口中的一个窗体,可以使用如下语法:

frames[i] //当前窗口的框架

self.frames[i] //当前窗口的框架

w.frames[i] //窗口 w 的框架

要引用一个框架的父窗口(或父框架),可以使用下面的语法:

parent //当前窗口的父窗口

self.parent //当前窗口的父窗口

w.parent //窗口 w 的父窗口

要从顶层窗口含有的任何一个框架中引用它,可以使用如下语法:

top //当前框架的顶层窗口

self.top //当前框架的顶层窗口

f.top //框架 f 的顶层窗口

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 关于li标签之间的间隔如何消除! - 野望之风

    关于li标签之间的间隔如何消除! - 野望之风

    2017-03-25 12:01

  • 微信小程序正式上线 可置于聊天窗口顶部 - iyifei

    微信小程序正式上线 可置于聊天窗口顶部 - iyifei

    2017-01-10 12:10

  • 设置块元素居窗口中间的位置 - sw缪斯

    设置块元素居窗口中间的位置 - sw缪斯

    2016-08-19 16:00

  • 关于html5 -- plus Webview模块管理应用窗口界面 - 挖哥哇哇哇

    关于html5 -- plus Webview模块管理应用窗口界面 - 挖哥哇哇哇

    2016-05-09 12:00

网友点评
m