处理办法:
1.同一域下,相同端口
2.父级、子集页面上同时标记 document.domain = "xxx.com"

操作内部元素:
1.jQuery使用 iframe.contents().find() 方法
2.document.getElementById('iframeId').contentWindow.document.body

控制父级页面元素:
1.$(".iframe-center",window.parent.document).removeAttr("style");

调用子页面方法:
1.window.frames["backstage-innerpage"].removeAppendText();

调用父页面方法:
1.window.parent.outterFunction();

现阶段工作比较忙,忙完详解。。。

如何实现iframe页面与父级页面js交互的更多相关文章

  1. js Iframe与父级页面通信及IE9-兼容性

    一. postMessage window.postMessage()方法安全地启用Window对象之间的跨源通信:例如,在页面和它产生的弹出窗口之间,或者在页面和嵌入其中的iframe之间. 二.语 ...

  2. Easyui弹出窗体在iframe的父级页面显示

    今天做EasyUI学习的预到了一个这样的问题:通过iframe加载的一个页面在调用$.messager.alert();这个方法后只能在iframe中显示alert效果而不是在全局的页面上显示这并不我 ...

  3. 页面嵌套iframe的时候引发的js交互问题

    今天在做一个新页面的时候,用到了iframe这个东西.结果出现了一个有趣的问题.自己写的页面和iframe里边的页面属性和js有冲突.具体的点说就是层级出现了问题.不能正常显示.不管怎么修改,总是解决 ...

  4. 在子页面操作父页面元素和iframe说明

    实现功能:在子页面操作父页面元素. 在实际编码的过程中,大家一定有这种需求:在父级页面有一个<iframe scrolling='auto'></iframe>内联框架,而我们 ...

  5. js之iframe子页面与父页面通信

    iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...

  6. iframe子页面与父页面元素的访问以及js变量的访问

    1.子页面访问父页面元素  parent.document.getElementById('id')和document相关的方法都可以这样用 2.父页面访问子页面元素  document.getEle ...

  7. 嵌入式iframe子页面与父页面js通信方式

    iframe框架中的页面与主页面之间的通信方式根据iframe中src属性是同域链接还是跨域链接,有明显不同的通信方式,同域下的数据交换和DOM元素互访就简单的多了,而跨域的则需要一些巧妙的方式来实现 ...

  8. JS中iframe子页面与父页面之间通信

    iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...

  9. js处理iframe中子页面与父页面里面对象的取得的解决方案

    [1]子页面取得父页面的dom对象   parent.window.$('#id').val("");   [2]父页面取得子页面的对象   $(window.frames[&qu ...

随机推荐

  1. 【Node.Js】npm国内被墙的解决方法

    移动网就是坑,有VPN也上不去,真操蛋~先吐槽一下@中国移动 折腾了一晚上,总是报连接错误,导致我npm安装不上,查了半天资料,找到个靠谱的,粘贴过来备用. 原文地址:http://snoopyxdy ...

  2. 系统优化怎么做-Tomcat优化

    大家好,这里是「聊聊系统优化 」,并在下列地址同步更新 博客园:http://www.cnblogs.com/changsong/ 知乎专栏:https://zhuanlan.zhihu.com/yo ...

  3. SQL SERVER 对权限的授予GRANT、拒绝DENY、收回REVOKE

    -----对用户member授权,允许其具有对数据表person的更新和删除的操作权限:GRANT UPDATE,DELETE ON personTO member WITH GRANT OPTION ...

  4. AtomicReference 原子引用

    AtomicReference和AtomicInteger非常类似,不同之处就在于AtomicInteger是对整数的封装,底层采用的是compareAndSwapInt实现CAS,比较的是数值是否相 ...

  5. 竞赛题解 - NOIP2018 赛道修建

    \(\mathcal {NOIP2018}\) 赛道修建 - 竞赛题解 额--考试的时候大概猜到正解,但是时间不够了,不敢写,就写了骗分QwQ 现在把坑填好了~ 题目 (Copy from 洛谷) 题 ...

  6. oracle编程300例-性能优化(一)

    1.在SELECT语句中避免使用“*” 2.尽可能减小记录行数 3.使用rowid高效删除重复记录 实例: delete from stu s where s.rowid>(select min ...

  7. Pagination

    using System.Collections.Generic; namespace Oyang.Tool { public interface IPagination { int PageInde ...

  8. Python-爬虫小计

    # -*-coding:utf8-*-import requestsfrom bs4 import BeautifulSoupimport timeimport osimport urllibimpo ...

  9. TypeScript : 语法及特性

    当let声明一个变量的时候它使用的词法作用域或者是块作用域.块作用域指的就是他们包含的块以外的不能访问. const声明:是let声明有相同的作用域规则,但是它被赋值后不能再被改变.类似于java的f ...

  10. 使用随机数以及扩容表进行join代码

    /** * 使用随机数和扩容表进行join */ JavaPairRDD<String, Row> expandedRDD = userid2InfoRDD.flatMapToPair( ...