JS操作iframe
2011年07月07日
1. 获得iframe的window对象存在跨域访问限制。
chrome:iframeElement. contentWindow firefox: iframeElement.contentWindow[b]ie6:iframeElement.contentWindow
文章Iframes, onload, and document.domain中说“he iframe element object has a property called contentDocument that contains the iframe’s document object, so you can use the parentWindow property to retrieve the window object.”意思就是一些浏览器可以通过iframeElement.contentDocument.parentWindow获得iframe的window对象。但经过测试firefox、chrome的element.contentDocument对象没有parentWindow属性。
function getIframeWindow(element){
return element.contentWindow;
//return element.contentWindow || element.contentDocument.parentWindow;
}
2. 获得iframe的document对象存在跨域访问限制。
chrome:iframeElement.contentDocument[b]firefox:iframeElement.contentDocument[b]ie:element.contentWindow.document[b]备注:ie没有iframeElement.contentDocument属性。
var getIframeDocument = function(element) {
return element.contentDocument || element.contentWindow.document;
};
3. iframe中获得父页面的window对象存在跨域访问限制。
父页面:window.parent[b]顶层页面:window.top[b]适用于所有浏览器
4. 获得iframe在父页面中的html标签存在跨域访问限制。
window.frameElement(类型:HTMLElement),适用于所有浏览器
5. iframe的onload事件非ie浏览器都提供了onload事件。例如下面代码在ie中是不会有弹出框的。
var ifr = document.createElement('iframe');
ifr.src = 'http://www.b.com/index.php';
ifr.onload = function() {
alert('loaded');
};
document.body.appendChild(ifr);
但是ie却又似乎提供了onload事件,下面两种方法都会触发onload
方法一:
方法二:
//只有ie才支持为createElement传递这样的参数
var ifr = document.createElement('');
document.body.appendChild(ifr);
由于iframe元素包含于父级页面中,因此以上方法均不存在跨域问题。
实际上IE提供了onload事件,但必须使用attachEvent进行绑定。
var ifr = document.createElement('iframe');
ifr.src = 'http://b.a.com/b.php';
if (ifr.attachEvent) {
ifr.attachEvent('onload', function(){ alert('loaded'); });
} else {
ifr.onload = function() { alert('loaded'); };
}
document.body.appendChild(ifr);
6. frameswindow.frames可以取到页面中的帧(iframe、frame等),需要注意的是取到的是window对象,而不是HTMLElement。
var ifr1 = document.getElementById('ifr1');
var ifr1win = window.frames[0];
ifr1win.frameElement === ifr1; // true
ifr1win === ifr1; // false
[b]
[/b][/b][/b][/b][/b][/b][/b]
发表评论
-
安装Phoenix-SDK-June-2008-RC1
2012-01-20 00:28 563安装Phoenix-SDK-June-2008-RC1 20 ... -
在Windows下安装Hadoop遇到的几个问题
2012-01-20 00:28 641在Windows下安装Hadoop遇到 ... -
Windows编程中的错误处理
2012-01-20 00:28 747Windows编程中的错误处理 2010年07月09日 ... -
Windows 7完美安装VC6和Delphi7
2012-01-20 00:28 828Windows 7完美安装VC6和Delp ... -
Programming Applications for Microsoft Windows - 第七部分 附录
2012-01-20 00:28 567Programming Applications for Mi ... -
GhostXP SP3 统一会员纯净版 V2.1
2012-01-19 01:25 943GhostXP SP3 统一会员纯净版 V2.1 2010年 ... -
JavaScript实现AJAX的拖动效果
2012-01-19 01:25 604JavaScript实现AJAX的拖动效果 2011年07月 ... -
javascript:history.go()和History.back()的区别
2012-01-19 01:25 1021javascript:history.go()和History ... -
VB基本语法
2012-01-19 01:25 1151VB基本语法 2011年06月24日 图形用户 ... -
实训报告
2012-01-19 01:25 755实训报告 2011年12月30日 ... -
关于部分Vista版本用户在DHCP下不能获取10地址问题解决
2012-01-17 00:41 947关于部分Vista版本用户在DHCP下不能获取10地址问题解决 ... -
系统内存蓝屏的错误代码 - 解决方案
2012-01-17 00:41 1239系统内存蓝屏的错误代 ... -
电脑故障以及解决百科全书(电脑知识四十七)2
2012-01-17 00:41 1283电脑故障以及解决百科 ... -
7月16号 键盘按键失灵? 蓝屏的终极处理?
2012-01-17 00:41 7177月16号 键盘按键失灵? 蓝屏的终极处理? 2011年07 ... -
调用规范与可变参数表
2012-01-17 00:41 664调用规范与可变参数表 ... -
安卓2.2启动链接项
2012-01-15 15:04 660安卓2.2启动链接项 2011年06月29日 ... -
药品力百汀被查出塑化剂 药监局要求立即停用
2012-01-15 15:03 515药品力百汀被查出塑化剂 药监局要求立即停用 2011年06月 ... -
2011-6-18
2012-01-15 15:03 5762011-6-18 2011年06月18日 国土部:安徽 ... -
警惕中国粮食领域出现“第二个大豆产业”
2012-01-15 15:03 623警惕中国粮食领域出现 ...
相关推荐
js操作iframe的一些知识,操作iframe
本篇主要是对JS操作iframe里的dom进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
js 操作iframe
主要介绍了JS去除iframe滚动条的方法,涉及javascript操作iframe中属性的技巧,非常具有实用价值,需要的朋友可以参考下
本篇文章介绍了js操作iframe的一些方法的实例代码与步骤,有需要的朋友可以参考一下
NULL 博文链接:https://justcoding.iteye.com/blog/770225
JS获取/设置iframe内对象元素、文档的几种方法 1、IE专用(通过frames索引形象定位): 代码如下: document.frames[i].document.getElementById(‘元素的ID’); 2、IE专用(通过iframe名称形象定位): 代码如下: ...
博文链接:https://hongan.iteye.com/blog/245498
通过HTTPClient界面在JSP中嵌入iframe子界面跨域时,无法获取跨域界面的属性值的问题
js 操作 frameset frame iframe对象
在做项目时,遇到了操作iframe的相关问题。业务很简单,其实就是在操作iframe内部某个窗体时,调用父窗体的一个函数。于是就写了两个很简单的htm页面用来测试,使用网上流行的方法在谷歌浏览器中始终报错,不能通过...
JS页面跳转和js对iframe进行页面跳转、刷新
主要介绍了js如何操作iframe父子窗体,需要的朋友可以参考下
如:index.html内引入iframe,在index内如何用JS操作iframe内的DOM元素? 先贴下index.html和iframe引入的a.html内容。 index-> <iframe src=a.html frameborder=0 name=one id=iframeId></iframe> ...
主要介绍了js实现iframe自动自适应高度的方法,涉及javascript操作iframe框架的技巧,非常具有实用价值,需要的朋友可以参考下