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. Intelij U

    1.https://link.jianshu.com/?t=http://idea.lanyus.com/,下载JetbrainsCrack-2.6.2.jar,放到bin目录 2.编辑bin目录下面 ...

  2. Java知多少(62)线程同步

    当两个或两个以上的线程需要共享资源,它们需要某种方法来确定资源在某一刻仅被一个线程占用.达到此目的的过程叫做同步(synchronization).像你所看到的,Java为此提供了独特的,语言水平上的 ...

  3. Java如何替换所有指定(出现)的字符串?

    在Java编程中,如何替换所有指定(出现)的字符串? 以下示例演示如何使用Matcher类的replaceAll()方法替换字符串中的所有出现的子字符串. package com.yiibai; im ...

  4. 使用UIScrollView 结合 UIImageView 实现图片循环滚动

    场景: 在开发工作中,有时我们需要实现一组图片循环滚动的情况.当我们使用 UIScrollView 结合 UIImageView 来实现时,一般 UIImageView 会尽量考虑重用,下面例子是以( ...

  5. 中文数据解码报错 UnicodeDecodeError: 'gbk' codec can't decode bytes in position 2-3: illegal multibyte sequence

    UnicodeDecodeError: 'gbk' codec can't decode bytes in position 2-3: illegal multibyte sequence 失败原因: ...

  6. linux下mysql 文件导入导出

    最近在做mysql的数据导入导出得到的一些经验,记录下. 1.首先要开通导入导出的功能,需要设置一个mysql的配置 可以在 my.conf 文件的最后增加配置项 secure-file-priv=' ...

  7. d3.js 根据需求定制pie图饼图

    参考网址: http://d3pie.org/#generator 用法: 1.在网址中,跟着步骤,设置样式和效果,最后获取pie的option格式 2.引入d3.min.js和d3pie.min.j ...

  8. 美团店铺评价语言处理以及分类(tfidf,SVM,决策树,随机森林,Knn,ensemble)

    第一篇 数据清洗与分析部分 第二篇 可视化部分, 第三篇 朴素贝叶斯文本分类 支持向量机分类 支持向量机 网格搜索 临近法 决策树 随机森林 bagging方法 import pandas as pd ...

  9. js document.activeElement 获得焦点的元素

    <body> <input type="text" id="test" value="ajanuw"> <sc ...

  10. web -- Navigator.vibrate(); 使设备(有振动硬件)产生有频率的振动

    MDN 文档 此方法需要用户手势. 否则,它返回false. const koa2 = require(`koa2`); const Router = require(`koa-router`); c ...