文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

实现iframe父窗体与子窗体的通信

本文主要会介绍如何基于MessengerJS，实现iframe父窗体与子窗体间的通信，传递数据信息。同时本文会提供一个可运行的实例代码，实现在父窗体中，获取到来自子窗体的数据的效果。...0.背景介绍 (1)需要在当前的前端项目中，使用iframe嵌套别的站点页面。 (2)当子窗体触发了一个事件后，要给父窗体传一个跳转地址的url。...1.采用方案 1.1 MessengerJS方案 可以采用MessengerJS方案，该方案可以实现父窗体与iframe之间的通信、多个iframe之间的通信。...对象的名字： // 父窗口中 - 添加消息对象, 明确告诉父窗口iframe的window引用与名字 messenger.addTarget(iframe1.contentWindow, 'iframe1...的名字和消息，例如父窗体要给子窗体发消息：  // 父窗口中 - 向单个iframe发消息  messenger.targets['iframe1'].send(msg1);  messenger.targets

10.7K771
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    如何检测本页中的iframe是否“加载”完成

    这其实是上一篇"iframe框架取值兼容ie/firefox/chrome的写法"的扩展应用: 应用场景：iframe个人感觉最独特的应用之一就是配合P3P协议可以实现跨域写入cookie(好象除此之外...，还没找到更有效的办法)，但是有时候我们不知道这个iframe页面是否执行完毕，有没有办法判断iframe里的页面是否load完成了呢？...document.getElementById("txt").value="ok";         } index.html: 检测本页中的所有...;     } else{         setValue();     } } 检测本页中的iframe是否加载完成 iframe... id="result" style="margin:10px;"> 准备就绪 值得注意的是：本文中的示例是放在按钮click事件中检测的，如果打算页面一打开就开始检测

    5.1K50

    JS获取节点的兄弟,父级,子级元素的方法

    2015-08-18 03:48:27 下面介绍JQUERY的父，子，兄弟节点查找方法 jQuery.parent(expr)  找父亲节点，可以传入expr进行过滤，比如$("span").parent...()或者$("span").parent(".class") jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素，不限于父元素 jQuery.children...(expr).返回所有子节点，这个方法只会返回直接的孩子节点，不会返回所有的子孙节点 jQuery.contents(),返回下面的所有内容，包括节点和文本。...()，返回所有之前的兄弟节点 jQuery.next(),返回下一个兄弟节点，不是所有的兄弟节点 jQuery.nextAll()，返回所有之后的兄弟节点 jQuery.siblings(),返回兄弟姐妹节点...jQuery.filter()是从初始的jQuery对象集合中筛选出一部分，而jQuery.find()的返回结果，不会有初始集合中的内容，比如$("p"),find("span"),是从元素开始找

    12.1K10

    基于iframe的跨域与更新父窗体地址栏的解决方案

    在访问到内部某个页面后，希望父窗体的地址栏跟随子窗体内部src，同时更新父窗体的地址栏，再刷新页面可以保持在当前访问的页面，同时可以分享链接。...内部在window.location的hash值变化后，获取子窗体的href值，再对父窗体的地址栏做修改。...，是可以达到更新父窗体地址栏src的效果，但会在修改地址栏的同时刷新页面。...这样每次iframe内部的src发生变化后，都会相应修改父窗体的地址栏，但又不会去刷新当前页面，效果上看起来就像是在自己的页面中操作，感受不到跨站点的问题。...每次刷新页面，在页面初始化时，就根据当前父窗体的地址栏中的url去得到属于运维平台的location.search值，用这个值修改iframe的src值，达到每次刷新页面，都可以根据当前地址栏的url，

    15.5K1350

    GhostFrame钓鱼框架的隐蔽iframe架构与检测对抗机制研究

    本文通过对捕获的GhostFrame样本进行逆向分析，系统还原其iframe调度逻辑、反分析策略及凭据回传机制；进而提出一套融合DOM行为监控、跨域iframe风险评分与客户端环境指纹验证的三层检测模型...关键词：GhostFrame；钓鱼框架；隐蔽iframe；动态内容加载；反分析；跨域iframe检测；DOM监控1 引言网络钓鱼作为网络犯罪的主要入口，其技术演进始终围绕两个核心目标：提升欺骗成功率与增强逃避检测能力...（合法iframe通常具备）；是否尝试通过postMessage向父页面发送敏感数据。...7 结语GhostFrame钓鱼框架通过隐蔽iframe架构实现了攻击效率与逃避能力的双重提升。本文通过对其技术细节的深度剖析，证明传统基于内容的检测方法已难以应对此类高级威胁。...所提出的三层检测模型不依赖iframe内部可读性，而是通过行为、属性与环境一致性进行间接推断，具有良好的工程可行性与部署兼容性。

    19510

    准确获取事件源的任意父级元素（事件委托）

    事件委托的特殊用法 问题回顾 当我们想给一个列表中的每个列表项添加相同的事件时，我相信最先想到的方法一定是事件委托，通过将事件监听器设置在其父节点上，利用事件冒泡的原理实现想要的操作，这样只进行了一次的...需要实现的功能是，点击这个盒子区域，输出对应的li对应的id，下面是这个li对应的代码片段，很显然在li内部存在着大量的子元素，我们需要通过给li的父元素ul绑定事件，从而实现事件委托，那么我们该如何确定我们点击的元素属于哪一个...li了，从而导致我们获取不到id无从下手 解决方法 下面我通过另一种方法很好的解决了这个问题 在我们的事件对象event中，存在着一个方法path，这个方法可以返回事件触发的所有父元素，我们可以使用这个方法...，整个方法的核心就是通过获取到触发事件元素的所有父元素集合，再通过筛选从而获得元素！...，因此我们可以通过事件对象下的path方法以及数组中的find方法选择出我们所要的列表项节点。

    3.4K30

    Vue如何在父级下使用v-slot的值

    关于作用域插槽v-slot的用法可以先看看文档 https://cn.vuejs.org/v2/guide/components-slots.html#%E4%BD%9C%E7%94%A8%E5%...9F%9F%E6%8F%92%E6%A7%BD 现在我们进入正题 我们用到一个第三方组件validate，这个第三方组件的插槽传了一个属性error值给我们，我们现在想要在父级中获得这个error值,...我们觉得可以在v-slot下使用一个方法，把error传到父级去，不就行了吗，的确是可以的： https://jsfiddle.net/jswenjie/pxru6y2m/5/ 问题出现 我们的页面有多个...validate的情况下，需要搜集所有的error，那么我们可以用个数组：https://jsfiddle.net/jswenjie/pxru6y2m/7/ 我们发现虽然结果是正确的，不过在控制台下出现了...有死循环的问题。 问题解决 为了解决这个问题，我考虑到是否可以用一个组件把 父级和子集关联起来呢，相当于给他们搭建一个桥梁，结果证明是可以的，就是略显繁琐，不知道大家有没有更好的方法呢？

    2K20

    Python检测删除你的好友-wxpy模

    下面是代码： from wxpy import * import time print("本软件采用特殊字符检测，即对方收不到任何信息！")...    all_friends = bot.friends()#把微信所有好友放进列表     for i in all_friends:         try:             print("检测...        except:             pass         time.sleep(2) #延时防频繁     bot.file_helper.send('检测结束，请退出网页微信...#通过文件传输助手发送检测结束     bot.logout()     input("检测结束，任意键退出...") except KeyError:#这个错误是因为微信官方封禁了这个微信号登陆网页微信的接口...input("检测失败，任意键退出...") 运行代码后直接回车就会弹出登陆二维码，扫码登陆就可以了  程序就会自动检测所有好友了 然后手机上就可以看到伤心的一幕了：

    1K20

    System.InvalidOperationException:“寄宿的 HWND 必须是指定父级的子窗口。”

    当试图在 WPF 窗口中嵌套显示 Win32 子窗口的时候，你有可能出现错误：“寄宿的 HWND 必须是指定父级的子窗口。”。 这是很典型的 Win32 错误，本文介绍如何修复此错误。...---- 我们在 MainWindow 中嵌入一个其他的窗口来承载新的 WPF 控件。...一般情况下我们当然不会这么去做，但是如果我们要跨越进程边界来完成 WPF 渲染内容的融合的时候，就需要嵌入一个新的窗口了。...由于窗口句柄是可以跨越进程边界传递的，所以这样的方式可以完成跨进程的 WPF 控件显示。...问题 你有可能在调试嵌入窗口代码的时候遇到错误： System.InvalidOperationException:“寄宿的 HWND 必须是指定父级的子窗口。”

    91230

    JS和JQuery获取当前元素的兄弟及父级等元素的方法

    parent() 或者 $("span").parent(".class") jQuery.parents(expr)，类似于 jQuery.parents(expr) ，但是是查找所有祖先元素，不限于父元素...var chils= s.childNodes;  //得到s的全部子节点 var par=s.parentNode;   //得到s的父节点 var ns=s.nextSibling;   //获得...s的下一个兄弟节点 var ps=s.previousSibling;  //得到s的上一个兄弟节点 var fc=s.firstChild;   //获得s的第一个子节点 var lc=s.lastChild...;   //获得s的最后一个子节点 JS获取节点父级，子级元素：JS的方法会比JQUERY麻烦很多，主要则是因为FF、谷歌浏览器会把你的换行也当作DOM元素：空的text元素，目前IE也是这样 　　 　　 原生的JS获取ID为test的元素下的子元素。

    14.2K10

    如何高效的批量删除亿级大表数据

    大概有一年左右的数据，一个表的数据已经达到亿级别的。这样算下来，一个表的数据至少是几十GB了。因此需要删除过期的数据，暂时保留近三个月的统计数据。...limit 10000 接着，我想用order by + limit实现删除，还是出现了上面的错误 后面DBA提示我说，为啥不用ID删除，说按id删除，速度和按索引列删除，不是一个数量级的 接着我想到了拆分一下...-04-06' 这里千万左右的数据大概需要10多秒 接着按id删除，一次删除10k，循环删除 delete from table_name where id < maxId limit 10000 直到把过期的时间删除完成...这里我没有msyql服务器的权限，通过java客户端连接删除，使用的spring jdbcTemplate这个接口 另外，这里一次删除10k还有个原因是，事务太大，影响其他服务的运行 还用到的技术，就是使用线程池来执行...还有一点就是，为了怕压到mysql服务器，这里线程池删除的时候回sleep(1000)，阻塞1s再删除，减轻mysql服务器的压力 今天搞了一下数据删除这一点东西，感觉mysql水很深，比如一个select

    5K20

    如何高效的批量删除亿级大表数据

    大概有一年左右的数据，一个表的数据已经达到亿级别的。这样算下来，一个表的数据至少是几十GB了。因此需要删除过期的数据，暂时保留近三个月的统计数据。...limit 10000 接着，我想用order by + limit实现删除，还是出现了上面的错误 后面DBA提示我说，为啥不用ID删除，说按id删除，速度和按索引列删除，不是一个数量级的 接着我想到了拆分一下...-04-06' 这里千万左右的数据大概需要10多秒 接着按id删除，一次删除10k，循环删除 delete from table_name where id < maxId limit 10000 直到把过期的时间删除完成...这里我没有msyql服务器的权限，通过java客户端连接删除，使用的spring jdbcTemplate这个接口 另外，这里一次删除10k还有个原因是，事务太大，影响其他服务的运行 还用到的技术，就是使用线程池来执行...还有一点就是，为了怕压到mysql服务器，这里线程池删除的时候回sleep(1000)，阻塞1s再删除，减轻mysql服务器的压力 今天搞了一下数据删除这一点东西，感觉mysql水很深，比如一个select

    1.8K20

    UTF-8编码中BOM的检测与删除

    对于UTF-8/16/32而言，它们名字中的8/16/32指的是编码单位是多少位的，也就是说，它们的编码单位分别是8/16/32位，换算成字节就是1/2/4字节，如果是多字节，就要牵扯到字节序，UTF-...UTF-8主要的优点是可以兼容ASCII，但如果使用BOM的话，这个好处就荡然无存了，除此以外，BOM的存在还可能引发一些问题，比如下面错误便都有可能是BOM导致的： Shell: No such file...or directory PHP: Warning: Cannot modify header information – headers already sent 在详细讨论UTF-8编码中BOM的检测与删除问题前...=utf-8 添加BOM： :set bomb 删除BOM： :set nobomb 查询BOM： :set bomb?...如何检测UTF-8编码中的BOM呢？ shell> grep -r -I -l $'^\xEF\xBB\xBF' /path 如何删除UTF-8编码中的BOM呢？

    3.3K20

    如何使用 JavaScript 检测用户是否启用三方 Cookie ？

    我能想到的并且一直有效的方法就是添加一个外部（三方）的 iFrame，让它来检测 iFrame 内部是否可以访问到 Cookie，并且会将 Cookie 的可用状态通知给父应用。...虽然这听起来挺奇怪的，我们好像无法直接通过 iFrame 调用父页面的功能。...但是我们可以使用 Message Event 来进行父子应用之间的通信，通过这个我们可以基于 URL 向其他浏览器发送消息，在我们现在这种情况下，我们可以从 iFrame 向可能在不同域上的父应用发送消息...首先，我们在 iFrame 内添加一个立即执行函数。在这个函数中，我们添加一个消息事件监听器，这个监听器会在从父级应用程序调用时触发。...然后，我们通过 parent.postMessage() 方法向父应用发送一条消息；在 iFrame 中，parent 是一个隐含的对象。 <!

    1.3K10

    油猴脚本从编写到检测

    创建iframe，加载商品的链接 两个函数做递归，在加载第二个商品时候需要将第一个iframe删除 // ==UserScript== // @name (自定义随意) // @namespace...= 0)now_car_info_i[0].parentNode.removeChild(now_car_info_i[0]); //调用父删除iframe var iframe =...所以如果要对脚本进行检测，没有像上面代码这样子向页面中植入iframe的话，通过去检测dom和window是无法检测出使用油猴脚本的。...检测方法一 通过鼠标点击事件检测，正常的用户使用鼠标点击按钮会有一个坐标，但是动过click()函数进行的点击操作是没有坐标的。...(event) { console.log('被点击，isTrusted值为:'); console.log(event.isTrusted); }); 测试 结 对于油猴脚本的检测难度是比较大的

    6K10
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券