不同frame之间传值的方法

1.不同frame是同源的

  • 不同框架之间能够通过iframe元素的contentWindow属性,获取到彼此的window对象,就能通过window.document访问各自的属性和对象。
function test(){
            //获取子框架的window对象
            var win=document.getElementById('frame').contentWindow;
            var text=win.document.getElementById('title').innerText;
            document.getElementById('show').innerText=text;
        }
  • 同源的不同框架共用同一个本地存储localStorage,可以通过监听storage事件(webkit不支持此事件),来进行通信。

2.不同frame是不同源的

  • 不同框架可以获取到彼此的window对象,但是不同源的话就不能使用获取到window对象的属性和方法,此时可以通过设置为同样的document.domain,就能访问相应的属性和方法。
    document.domain='example.com';

  • 通过HTML5中的window.postMessage来跨域传送数据,接收消息的框架监听message事件,消息内容存储在事件对象的data属性中。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 8,707评论 1 41
  • 跨域资源共享 CORS 对于web开发来讲,由于浏览器的同源策略,我们需要经常使用一些hack的方法去跨域获取资源...
    默默先生Alec阅读 3,717评论 0 0
  • JavaScript 1. HTML对象获取问题 FireFox:document.getElementById(...
    LaH_71d7阅读 4,262评论 0 0
  • 今天已经是最后一天了,16天转眼就过去了,时间飞逝,一转眼今年也过去了一半,每一天都在充实忙碌的生活,很享受这样的...
    艾哲宇阅读 1,760评论 0 0
  • 活好现在的每一天,为了更好的明天不断努力着。 愿所有的事都能如愿以偿。 努力。
    追梦的青年阅读 1,787评论 0 0

友情链接更多精彩内容