iframe 向父窗口

window.parent.postMessage('向父窗口传递值',*);

父窗口向 iframe 内部子窗口传值

documnet.querySelector('iframe').contentWindow.postMessage('向iframe传递值',*);

接受信息

window.addEventList('message',  (e) => {
console.log(e.data);
});

如果执行 e.data 不存在

window.addEventList('message',  (e) => {
try{
if (e.data type e.data ==='string' ) {
console.log(e.data);
}
} catch (err) {
console.log(err)
}
});

注意传递dom结构高度

以vue为例,mounted 不一定dom都渲染完了,this.$nextTick(function () {...}) 也不定很有效解决,这时只能调用window.onload

iframe 和 父窗口传递的更多相关文章

  1. Iframe刷新父窗口的几种方式

    /*Iframe刷新父窗口的几种方式在iframe的子页面中,使用onload刷新父页面的时候,遇到了一些问题. 1.目前来说,测试成功,并且兼容IE6/7和FF的刷新方式. */ <scrip ...

  2. iframe子父窗口相互操作方法或元素

    一.jquery 父.子页面之间页面元素的获取,方法的调用: 1. 父页面获取子页面元素: 格式:$("#iframe的ID").contents().find("#if ...

  3. iframe中子父窗口互调的js方法

    转载自:http://www.cnblogs.com/chinafine/archive/2011/09/15/2177746.html 一.父窗口调用iframe子窗口方法 1.HTML语法:< ...

  4. Jquery获取iframe子/父窗口中的标签

    获取子窗口中的标签: $("#id",document.frames('iframename').document); 获取父窗口中的标签: $('#id', parent.doc ...

  5. Iframe和父窗口互调方法的集合

    1.子iframe里调用父级的方法:window.parent.document.   2.父级里调用子集iframe:window.frames["iframe_text"].d ...

  6. layui之弹出层--从父窗口传递数据到子窗口

    原文链接:https://blog.csdn.net/Code_shadow/article/details/80524633 var Index = layer.open({ title: &quo ...

  7. iframe里面的页面调用父窗口,左右窗口js函数的方法

      iframe里面的页面调用父窗口,左右窗口js函数的方法 实现iframe内部页面直接调用该iframe所属父窗口自定义函数的方法. 比如有A窗口,A内有个IFRAME B,B里面的装载的是C页面 ...

  8. Js的iframe相关问题,如何判断当前是否在iframe中,iframe和它的父窗口如何通信

    一.前言: 在web中,为了丰富我们的内容,往往需要引用其它HTML文件,这时候就需要用到 iframe 标签,本文就主要记录一下使用iframe所需要注意的问题 iframe 所使用的环境(笔者所遇 ...

  9. iframe中子父页面跨域通讯

    目录 #跨域发送信息 #跨域接收信息 #示例Demo 在非跨域的情况下,iframe中的子父页面可以很方便的通讯,但是在跨域的情况下,只能通过window.postMessage()方法来向其他页面发 ...

随机推荐

  1. WPF 4.5 is here : check out the new features !

    So what's New in WPF Version 4.5 Developer Preview ? Here is a list of the new features and their re ...

  2. Linux下搭建LAMP环境(YUM)

    安装Apache 1.安装Apache yum -y install httpd 2. Apache配置httpd.conf 通过命令 find / -name httpd.conf 找到Apache ...

  3. php中json_decode及foreach使用总结

    <?php $arr=array(); //例子1 $json_str= '{"ret":"OK","questions":{ &qu ...

  4. sublime text plugins

    Sublime Text 插件,HTML+CSS+JAVASCRIPT+JSON快速格式化:  htmlpretty 快捷键:Ctrl+Shift+H Essential Sublime Text 2 ...

  5. mysql性能调整三板斧

    大意是,用2/8原则,多快好省的解决大部分事情.所以三板斧,仅限整体调整,不牵扯具体细节. 1.innodb 使用innodb引擎 2.innodb_buffer_pool 调整和innodb有关的参 ...

  6. linux下通过curl访问web服务器

    在通过xshell或者其他远程连接工具连接linux服务器,没安装浏览器,却要测试web服务的请求: 可以使用curl 访问web服务器 例如返回百度的主页内容 #curl www.baidu.com ...

  7. C# 根据类名创建类的实例对象

    因为我使用这个方法的类都是和AbstractScenePageDTO处于一个命名空间以及程序集下的,所以获取命名空间和程序集的时候,直接使用AbstractScenePageDTO这个类进行获取,这样 ...

  8. Django model中设置多个字段联合唯一约束

    Django中model部分的写法, 参见 unique-together 部分文档. class MyModel(models.Model): field1 = models.CharField(m ...

  9. django高并发优化

    我开始对web开发产生了兴趣,并决定自己也尝试开发一个网站.在此之前,我做过3年的java application的开发,对web开发应该算一无所知.在比较了java,php,ror,和python后 ...

  10. Docker Compose一键部署Nginx反向代理Tomcat集群

    目录结构如下 mysql/conf/my.cnf [mysqld] user=mysql port=3306 datadir=/var/lib/mysql socket=/var/lib/mysql/ ...