• js中top、self、parent


    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="300;height:200;">
            </iframe>
            <iframe id="myframe0" src="http://localhost:888/child0.html" frameborder="3" style="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>
    

      

  • 相关阅读:
    json dump dumps load loads
    python tip: 格式化 深浅copy sorted
    转载整理
    python 计算器练习
    实验5 OSPF虚连接和验证配置
    实验4 OSPF的特殊区域STUB和NSSA
    实验3ospf路由聚合
    实验2 OSPF基本配置
    实验1静态ECMP的浮动静态路由配置
    补充实验6:tftp
  • 原文地址:https://www.cnblogs.com/jcxfighting/p/8466278.html
Copyright © 2020-2023  润新知