zoukankan      html  css  js  c++  java
  • iframe多层嵌套时获取元素总结

    父页面获取子页面元素:

    注意:onload事件

    jQuery获取:
    $("iframe").contents().find("holder")......;

    (嵌套三层,或者更多时)
    $('iframe').contents().find('iframe').contents().find("iframe")......


    js获取:
    window.frames["holder"].document 或者 window.frames[0].document(不推荐)

    (嵌套三层,或者更多时)
    window.frames[0].window.frames[0](......).document


    补充拓展:(仅供参考)

    document.frames 与 window.frames 之间的区别

    document.frames 只有IE、Opera 支持,等同于 window.frames。用来取得当前页面内 window 对象的集合。

    在 Firefox、Chorome、Safari中使用 document.frames 不能获取到 FRAME 元素

    window.frames['myframe'] 代替 document.frames('myframe')或document.frames['myframe']。

    注意:window.frames只可写成window.frames['myframe']不能写成window.frames('myframe')


    子页面获取父页面元素:
     

    第一、在iframe中查找父页面元素的方法:
    $('#id', window.parent.document)

    第二、在父页面中获取iframe中的元素方法:
    $(this).contents().find("#suggestBox")

    第三、在iframe中调用父页面中定义的方法和变量:
    parent.method
    parent.value

     $(window.parent.document.body) //麻烦的方法:
     
     $($(window).eq(0)[0].parent.document).find('body'); ,忘了可以用前面的方法了

    1、子页面获取iframe父页面的DOM

    jQuery获取:
    $("#holder",parent.document) 

    js获取:
    parent.document.getElementById("holder")  

    2、子页面获取父页面里的其他iframe子页面里的DOM

    jQuery获取:
    $("#holder",window.parent.frames["holder"].document)

    js获取:
    window.parent.frames["holder"].document.getElementById("holder")


    补充拓展:(仅供参考)
    opener 与 parent 之间的区别

    opener:

    opener用于在window.open的页面引用执行该window.open方法的的页面的对象。例如:A页面通过window.open()方法弹出了B页面,在B页面中就可以通过opener来引用

    A页面,这样就可以通过这个对象来对A页面进行操作。

    parent:

    parent用于iframe,frame中生成的子页面中访问父页面的对象。例如:A页面中有一个iframe或frame,那么iframe或frame中的页面就可以通过parent对象来引用A页面

    中的对象。这样就可以获取或返回值到A页面中。

    总结:
    parent指父窗口,在FRAMESET中,FRAME的PARENT就是FRAMESET窗口。 
    opener指用WINDOW.OPEN等方式创建的新窗口对应的原窗口。
    parent是相对于框架来说父窗口对象。 
    opener是针对于用window.open打开的窗口来说的父窗口,前提是window.open打开的才有。
  • 相关阅读:
    SpringBoot-Mysql模板多数据源加载
    SpringCloud-动态配置变化监控-获取变化(支持Config、Nacos)
    SpringBoot-ElasticJob封装快速上手使用(分布式定时器)
    关键字(标签)提示组件——拼音、汉字混合搜索
    写一个高性能的敏感词检测组件
    一个文件搞定Asp.net core 3.1动态页面转静态页面
    浅谈C#在网络波动时防重复提交
    对RC4算法进行改写,新的加密算法RCX。
    【ToolGood.Words】之【StringSearch】字符串搜索——基于BFS算法
    万能解决方案之彻底解决macOS cocoapods环境的所有问题
  • 原文地址:https://www.cnblogs.com/webqiand/p/4602887.html
Copyright © 2011-2022 走看看