Javascript 判断 iframe 中的变量是否为对象

前言

公司之前的项目中,为了实现模块化,在 web 后端使用了 iframe 来组织框架和页面。由于当时没有很好地规划,iframe 子页面和框架主页面里面的 js 类库经常混用(即 iframe 子页面利用 top 对象调用框架主页面的方法),因此出现了本例的 chrome 中 iframe 子页面中的变量值在框架主页面中判断是否为对象的问题。

复现

本文借助 chrome 的控制台模拟 框架主页面iframe 子页面

在框架主页面中定义一个变量 a,并判断其是否为对象:

在 iframe 子页面中定义一个变量 b,并判断其是否为对象:

可以发现,一切正常。

而在 iframe 子页面中判断框架主页面的变量是否为对象:

或将 iframe 子页面的对象传入框架主页面进行判断:

结果都为 false!

解决

可以使用如下方法判断变量值是否为对象:

Object.prototype.toString.call(<YOUR_OBJ_PARAM>) === '[object Object]'

当然,还是不建议混用 iframe 子页面和框架主页面的 js 类库。

参考

https://blog.csdn.net/zhangjing0320/article/details/81230170

后记

玛德真的哭了,这些代码都不是我写的,为什么他们之前看都好好的,一到我来看就各种报错。算上这个,已经是这两周的第三次了QAQ。有的时候思路还是窄了,这次还是多亏同事提醒我才发现这种混乱调用,找到问题所在。还是要拓宽思路啊!

Javascript 判断 iframe 中的变量是否为对象的更多相关文章

  1. javascript 获取iframe中的dom

    太扯了,一个多小时都没搞定,获取不到iframe中的dom元素. <div id="one"> this is one </div> <div> ...

  2. 通过javascript在iframe中加载html

    在spring mvc中,虽然有时候,在控制器中设置返回值是json对象,但在拦截器出现错误的时候,仍然可能返回html(根据设置的不同),如果要展示这些html,最好把他们放入iframe中,以防这 ...

  3. JavaScript判断字符串中出现次数最多的字符,并统计其次数

    要求: 输出一个给定字符串``中出现次数最多的字符,并统计其次数. 实现思路: 利用charA()遍历这个字符串 把每个字符都存储给对象,如果对象没有该属性,就先幅值为1,如果存在了就+1 遍历对象, ...

  4. javascript 及 vue 中的变量前面的美元符号 $ 是什么意思

    $ 您会注意到,我们将库代理为以美元符号“$”为前缀的属性名. 你可能还看过其他的属性和方法,例如,$refs, $on, $mount等等也都是以”$”开头. 虽然属性名上添加前缀不是必须的,但是这 ...

  5. javascript判断数组中是否包含某个元素

    //判断数组array中是否包含元素obj的函数,包含则返回true,不包含则返回false function array_contain(array, obj){ for (var i = 0; i ...

  6. 关于javascript在作用域中的变量定义你所不知道的一些东西

    //先看一段代码 var a = 100; function test(){ alert(a); var a = 200; } test(); /* 结果:undifined 原因:js引擎在执行sc ...

  7. JavaScript控制iframe中元素的样式

    //根据ID获取要操控元素 var deptObjs=document.getElementById("IFRAMEID").contentWindow.document.getE ...

  8. [javascript] 判断 iframe 是否加载完成

    from http://www.planabc.net/2009/09/22/iframe_onload/ var iframe = document.createElement("ifra ...

  9. [转载]js javascript 判断字符串是否包含某字符串,String对象中查找子字符,indexOf

    var Cts = "bblText"; if(Cts.indexOf("Text") > 0 ) { alert('Cts中包含Text字符串'); }

随机推荐

  1. Maven 基础标签之版本管理和冲突解决

    前言 我们在做java项目的时候由于jar包太多,我们就需要使用maven做项目管理,管理项目的jar包依赖,包括打包上线 maven基础 Maven 是一个项目管理工具,主要用于项目构建,依赖管理, ...

  2. Spring Cloud Alibaba - Feign

    Feign Feign简介 使用Feign实现消费者客户端 使用Feign+Ribbon实现客户端负载均衡 底层的负载均衡策略还是使用Ribbon通过Feign进行调用 Feign的相关配置 ribb ...

  3. VScode安装配置

    一.安装VScode 进入VScode官网Visual Studio Code下载 安装 二.设置中文 打开vscode 重启vscode 三.美化 四.安装拓展插件 Auto Close Tag ( ...

  4. Git 使用revert回滚已提交的commit

    在git使用中如果提交错误的代码至远程服务器,可以使用git revert 命令回滚单次commit并且不影响其他commit. 回滚最新一次的提交记录: git revert HEAD 回滚前一次的 ...

  5. FTP三种访问模式

    FTP匿名访问模式是比较不安全的服务模式,尤其在真实的工作环境中千万不要存放敏感的数据,以免泄露. vsftpd程序默认已经允许匿名访问模式,我们要做的就是开启匿名用户的上传和写入权限,写入下面的参数 ...

  6. Element Vue 开箱即用框架如何使用-测试开发【提测平台】阶段小结(二)

    微信搜索[大奇测试开],关注这个坚持分享测试开发干货的家伙. 上一篇总结了后端服务接口的开发,这篇我们主要来总结下前后端分离开发中的前端部分,主要是开箱即用的框架介绍和之前章节组件的梳理和部分的扩展内 ...

  7. noip19

    sb\(O(n^{2})\)传参 T1 暴力一会儿就码好,结果.. 祭奠一下死去的代码 died #include<cstdio> #define MAX 1010 #define re ...

  8. http扩展小插件

    支持.net framework4.5.1,.net core2.0及以上 应用层需要引用包Kogel.Net,Nuget上可以下载安装. 或者使用Nuget命令添加包 Install-Package ...

  9. vue路由history模式,nginx配置

    nginx配置内容 # For more information on configuration, see: # * Official English Documentation: http://n ...

  10. 基础篇:一文讲懂树莓派命令行文本编辑工具Vim的使用

    简介 众所周知,在Linux系统下的命令行调试界面,经常会遇到需要文本编辑的情况,而树莓派官方系统默认自带了Nano编辑器,Nano的操作门槛更低,但却不如Vim编辑器方便.Vim编辑器是由早期在Li ...