javascript 中contentWindow和 frames和iframe之间通信
iframe父子兄弟之间通过jquery传值(contentWindow && parent),iframe的调用包括以下几个方面:(调用包含html dom,js全局变量,js方法)
主页面调用iframe;
iframe页面调用主页面;
主页面的包含的iframe之间相互调用;
主要知识点
1:document.getElementById("ii").contentWindow 得到iframe对象后,就可以通过contentWindow得到iframe包含页面的window对象,然后就可以正常访问页面元素了;
2:$("#ii")[0].contentWindow 如果用jquery选择器获得iframe,需要加一个【0】;
3:$("#ii")[0].contentWindow.$("#dd").val() 可以在得到iframe的window对象后接着使用jquery选择器进行页面操作;
4:$("#ii") [0].contentWindow.hellobaby="dsafdsafsdafsdafsdafsdafsadfsadfsdafsadfdsaffdsaaaaaaaaaaaaa"; 可以通过这种方式向iframe页面传递参数,在iframe页面window.hellobaby就可以获取到值,hellobaby是自定义的变量;
5:在iframe页面通过parent可以获得主页面的window,接着就可以正常访问父亲页面的元素了;
6:parent.$("#ii")[0].contentWindow.ff; 同级iframe页面之间调用,需要先得到父亲的window,然后调用同级的iframe得到window进行操作;
ie 中为 frames["id"]其他为document.getElementById("id").contentWindow
contentWindow属性是指指定的frame或者iframe所在的window对象
在IE中iframe或者frame的contentWindow属性可以省略,但在Firefox中如果要对iframe对象进行编辑则
必须指定contentWindow属性。
function EnableEdit()
{
var editor;
editor = document.getElementById("HtmlEdit").contentWindow;
// 针对IE浏览器, make it editable
editor.document.designMode = 'On';
editor.document.contentEditable = true;
// For compatible with FireFox, it should open and write something to make it work
editor.document.open();
editor.document.writeln('<html><head>');
editor.document.writeln('<style>body {background: white;font-size:9pt;margin: 2px; padding: 0px;}</style>');
editor.document.writeln('</head><body></body></html>');
editor.document.close();
}
<iframe ID="HtmlEdit" MARGINHEIGHT="1" MARGINWIDTH="1" width="100%" height="312">
</iframe>
<html>
<body>
<script>
var ifr = document.createElement("iframe");
document.body.appendChild(ifr);
var ifrdoc = ifr.contentWindow.document;
var s = fixingHTB.innerHTML; //进入可编辑模式前存好
ifrdoc.designMode = "on"; //文档进入可编辑模式
ifrdoc.open(); //打开流
ifrdoc.write(s);
ifrdoc.close(); //关闭流
ifrdoc.designMode ="off"; //文档进入非可编辑模式
</script>
</body>
</html>
javascript 中contentWindow和 frames和iframe之间通信的更多相关文章
- 简单理解javascript中的原型对象,实现对之间共享属性和行为
javascript中提供了构造函数.可以方便的创建对象. 典型的构造函数例如以下: function Person(name, age) { this.name = name; this.age = ...
- iframe之间通信问题及iframe自适应高度问题
下面本人来谈谈iframe之间通信问题及iframe自适应高度问题. 1. iframe通信 分为:同域通信 和 跨域通信.所谓同域通信是指 http://localhost/demo/iframe/ ...
- javascript中prototype、constructor以及__proto__之间的三角关系
三者暧昧关系简单整理 在javascript中,prototype.constructor以及__proto__之间有着“著名”的剪不断理还乱的三角关系,楼主就着自己对它们的浅显认识,来粗略地理理以备 ...
- JavaScript中利用Ajax 实现客户端与服务器端通信(九)
一:Ajax (Asynchronous JavaScript and XML)不是一个新的技术,事实上,它是一些旧有的成熟的技术以一种全新的更加强大的方式整合在一起 Ajax的关键技术: 1.使用X ...
- 深入剖析JavaScript中的对象与原始值之间的转换机制
我们都知道原始值之间是可以互相转换的,但是如果对象转原始值呢? 所有的对象在布尔上下文(context)中均为 true .所以对于对象,不存在 to-boolean 转换, 只有字符串和数值转换. ...
- JavaScript中变量、参数、函数之间的关系
------------------------------ 废话不多说,直接开始. 我们看一段代码(参考其他资料所得) <script type="text/javascript&q ...
- JavaScript中字符串与16进制之间的转换
一.字符串转换为16进制 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- iOS开发中的错误整理,线程之间通信练习,加载图片的练习中出现的错误 -- Http请求错误
控制台打印:Application Transport Security has blocked a cleartext HTTP (http://) resource load since it i ...
- Javascript中的一种深复制实现
在javascript中,所有的object变量之间的赋值都是传地址的,可能有同学会问哪些是object对象.举例子来说明可能会比较好: typeof(true) //"boolean&qu ...
随机推荐
- 测试php单例模式和静态访问,实例化访问的效率
// 测试的类class Memory { private static $a= null; public function __construct() { return self::$a; } pu ...
- 什么是Java内存模型(JMM)
什么是java内存模型 缓存一致性问题 在现代计算机中,因为CPU的运算速度远大于内存的读写速度,因此为了不让CPU在计算的时候因为实时读取内存数据而影响运算速度,CPU会加入一层缓存,在运算之前缓存 ...
- http协议及http协议和tcp协议的区别
http是应用层的协议,并且无连接,无状态的协议. http协议的特点: 1.支持c/s模式 2.简单快速:客户端向服务器端传送数据的时候,只需要发送请求方法和路径,请求方法有:post,get,he ...
- HDU-2243
考研路茫茫——单词情结 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...
- Asp.net 模板下载和导入到DataTable中
HTML页面: <tr> <td colspan=" style="text-align: left; border: 1px;"> <as ...
- 通过javascript进行UTF-8编码
通过javascript进行UTF-8编码 javascript的字符集: javascript程序是使用Unicode字符集编写的.Unicode是ASCII和Latin-1的超集,并支持地球上几乎 ...
- 洛谷P4609 [FJOI2016]建筑师(第一类斯特林数+组合数)
题面 洛谷 题解 (图片来源于网络,侵删) 以最高的柱子\(n\)为分界线,我们将左边的一个柱子和它右边的省略号看作一个圆排列,右边的一个柱子和它左边的省略号看作一个圆排列,于是,除了中间的最高的柱子 ...
- leetcode104 Maximum Depth
题意:二叉树最大深度 思路:递归,但是不知道怎么回事直接在return里面计算总是报超时,用俩变量就可以A···奇怪,没想通 代码: int maxDepth(TreeNode* root) { if ...
- [BZOJ1305][CQOI2009]跳舞(网络流)
1305: [CQOI2009]dance跳舞 Time Limit: 5 Sec Memory Limit: 162 MBSubmit: 3944 Solved: 1692[Submit][St ...
- [Lydsy1806月赛] 质数拆分
(mmp我已经不知道是第几次写NTT被卡了) 可以发现质数个数是 N/log(N) 级别的,1.5*10^5之内也只有 10000 多一点质数. 所以我们第一层暴力卷积,常数可以优化成 1/2. 然后 ...