• 父框架与子框架的互操作


    一个页面中可能嵌入多个iframe,该页面与iframe中的子页面的互操作方式如下:

    1、父页面访问子页面

      说明实例,index.aspx为父页面,index2.aspx为子页面并定义了函数save(),index.aspx如下:

    <div>
        <iframe id="assetReportIframe" name="myframe" src="index2.aspx"></iframe>
    </div>

     1.1 window.frames

      window对象包含属性frames,其为当前页面中子框架window对象的集合,因此可以通过该属性访问子框架window对象。属性frames的访问方式有两种:

        a、索引

        b、名称

        c、id

      通过索引或名称,ie7、ie8、ie11、chrome表现相同,如:window.frames[0]或者window.frames['myframe']

      通过id,ie(包括7、8、11)与chrome存在差异:

        ie中,window.frames['assetReportIframe']返回的是该框架的window对象

        chrome中,window.frames['assetReportIframe']返回的是该框架元素的对象

     1.2 iframe.contentWindow

      此为通用方式:document.getElementById('assetReportIframe').contentWindow.save()

    2、子页面访问父页面

      子页面访问父页面方式比较简单,即在子页面调用window.top或window.parent

    3、子页面与父页面的js执行均调用同一线程,即仍为单线程

      测试方法:利用同步ajax会阻断线程执行的特点,分别在父页面与子页面调用ajax和alert函数,结果为子页面js会被父页面阻断

    window.open()打开的页面也可以与父页面互操作,另外,注意:

      1、以上所有操作须在同一域中,不同域之间的消息传递可是使用XDM,详见《javascript高级程序设计》

        2、在ie7、ie8、ie11、chrome中,iframe定义的格式为<iframe></iframe>,而不能使用<iframe />,后一种格式虽然浏览器能够识别,但会导致浏览器忽略该iframe之后script标签,即iframe之后的js不会执行

  • 相关阅读:
    结对作业评分
    Week6&7——第一次项目冲刺(Alpha版本)
    软工辅修团队项目选题参考
    Week5——团队选题&需求分析
    Week4——结对练习&团队作业1
    nginx与Apache的对比以及优缺点
    oracle数据库-错误编码大全
    spring MVC原理
    Java操作Memcached
    zookeeper应用场景-java
  • 原文地址:https://www.cnblogs.com/MattCheng/p/5069713.html
Copyright © 2020-2023  润新知