iframe.contentWindow 属性:关于contentWindow和contentDocument区分
定义和用法
contentDocument 属性能够以 HTML 对象来返回 iframe 中的文档,可以通过所有标准的 DOM 方法来处理被返回的对象。
语法:frameObject.contentWindow,或者 iframeObject.contentWindow(不是jquery对象)
1、contentWindow 这是个只读属性,返回指定的iframe的窗口对象。它虽然不是标准的一部分,但各个主流浏览器都支持。
2、contentDocument Firefox 支持,IE6,IE7都不支持,IE8开始支持,需要如此访问 document.frames['J_mainframe'].document。
兼容获取document对象:
var getIFrameDoc = function(){
var iobj = document.createElement("iframe");
document.getElementsByTagName("body")[].appendChild(iobj);
return iobj.contentDocument || iobj.contentWindow.document;
}
基本使用:
1、document.getElementById("myiframe").contentWindow,得到iframe对象后,就可以通过contentWindow得到iframe包含页面的window对象,然后就可以正常访问页面元素了;
2、$("#myiframe")[0].contentWindow,jquery选择器获得iframe,先把jquery对象转换为DOM对象,或者使用get()方法转换;
3、$("#myiframe")[0].contentWindow.$("#dd").val(),可以在得到iframe的window对象后接着使用jquery选择器进行页面操作;
4、$("#myiframe")[0].contentWindow.username="zhangsan"; 可以通过这种方式向iframe页面传递参数,在iframe页面window.username就可以获取到值,username是自定义的全局变量;
5、在iframe页面通过parent可以获得主页面的window,接着就可以正常访问父亲页面的元素了;
6、parent.$("#frame_A")[0].contentWindow.document.getElmentById("#frame_B"); 同级iframe页面之间调用,需要先得到父亲的window,然后调用同级的iframe得到window进行操作;
//在子级iframe设置 父级 iframe ,或 孙级 iframe 高度。
function showIframeH(){
var parentWin = parent.document.getElementById("test");
if(!parentWin) return false; var sub = parentWin.contentWindow.document.getElementById("test2");
if(!sub) return false; var thirdHeight = sub.contentWindow.document.body.offsetHeight; //第三层 body 对象 sub.height = thirdHeight; //设置第二层 iframe 的高度 var secondHeight = parentWin .contentWindow.document.body.offsetHeight; //第二层 body 对象
parentWin .height = secondHeight; //设置第一层 iframe 的高度
}
一、在使用iframe的页面时,要操作这个iframe里面的DOM元素可以用:contentWindow、contentDocument
1、先获取iframe里面的window对象,再通过这个对象,获取到里面的DOM元素
例子:
var ifr = document.getElementById("iframe");
ifr.contentWindow.document.getElementById("XXXXX") <iframe src="a.html" id=""></iframe>
ifr.contentWindow 这里,返回的是iframe的window对象,所以后面可以接着调用document方法,再接着调用getElementByTagName。那么就可以对iframe里面的元素进行操作了。
二、在iframe本页面,要操作这个iframe的父页面的DOM元素(即嵌套这个iframe的页面)可以用:
window.parent、window.top(这里的TOP是获取的顶层,即有多层嵌套iframe的时候使用)
var ifr = document.getElementByTagName("iframe");
ifr.parent.document.getElementById("XXXXX") <iframe src="a.html" id=""></iframe>
实例:
iframe.contentWindow 属性:关于contentWindow和contentDocument区分的更多相关文章
- IFrame与window对象(contentWindow)
ref:http://blog.csdn.net/dongzhiquan/article/details/5851201 var detialIframe=document.all("det ...
- jquery得到iframe src属性值的方法
这篇文章主要介绍了jquery得到iframe src属性值的方法,很简单,很实用,需要的朋友可以参考下 取得iframe src属性的的值: Html代码 <!DOCTYPE HTML> ...
- 如何获取监听iframe src属性的变化进行后续操作
应用场景,当iframe内发生点击事件内容改变时,如果我们想获取变化后的iframe的 src 属性值,就可以使用如下方式去获取 <iframe id="taobaoOrder&quo ...
- iframe 标签属性解读
iframe 元素会创建包含另外一个文档的内联框架(即行内框架)
- iframe初始化属性
<iframe id="user" src="xxx.html" frameborder="0" width="" ...
- 关于justify-content属性的再学习(区分三个属性)
justify-content属性: 用来表示可伸缩项目在主轴方向上的对齐方式: 取值范围为flex-start,flex-end,center,space-between,space-around: ...
- 原生JS操作iframe里的dom
转:http://www.css88.com/archives/2343 一.父级窗口操作iframe里的dom JS操作iframe里的dom可是使用contentWindow属性,contentW ...
- JavaScript对iframe的DOM操作
在IE6.IE7中,我们可以使用 document.frames[ID].document 来访问iframe子窗口中的document对象,可是这是不符合W3C标准的写法,也是IE下独有的方法,在F ...
- iframe的Dom操作
我最近遇到这样一个需求, 抛开业务相关不谈,但从技术上说:页面中选择公司中的页面,在iframe中展示被选的页面,并且要对页面做一些Dom相关的处理.也就是说我们需要在父级页面中操作子页面(ifram ...
随机推荐
- [C语言]防止头文件和全局变量重复定义
昨天下午将全局变量定义在H文件中导致链接时提示变量在多个obj文件内重复. 解决办法如下: 将变量移入C文件中进行定义,然后在H文件中加入extern在变量之前. 这样当其它C文件引用该全局变量时 ...
- 常用shell脚本命令
常用shell脚本命令 1.显示包含文字aaa的下一行的内容: sed -n '/aaa/{n;p;}' filename 2.删除当前行与下一行的内容: sed -i '/aaa/{N;d;}' f ...
- ACdream 1029 前缀和
Multiplication Time Limit: 2000/1000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) Subm ...
- java 复习整理(五 类加载机制与对象初始化)
类加载机制与对象初始化 一 . 类加载机制 类加载机制是指.class文件加载到jvm并形成Class对象的机制.之后应用可对Class对象进行实例化并调用.类加载机制可在运行时动态加载外部的类, ...
- vue jsonp解决跨域处理
1.安装vue jsonp npm i -S vue-jsonp 2.在main.js中导入vue-jsonp import VueJsonp from 'vue-jsonp' 通过use方法,挂载到 ...
- HDU 3389 Game (阶梯博弈)
Game Time Limit: 1000MS Memory Limit: 32768KB 64bit IO Format: %I64d & %I64u Submit Status D ...
- 同余方程(NOIP2012)
原题传送门 水~ 纯拓展欧几里得算法.. #include<iostream> #include<cstdio> #define ll long long using name ...
- Linux c 目录操作函数scandir
头文件#include <dirent.h> 函数定义:int scandir(const char *dir,struct dirent **namelist,int (*filter ...
- mogilefsd同步速度调优
#查看主从mogadm settings list #一点点调试mogadm settings listmogadm settings set internal_queue_limit 500moga ...
- Codeforces 825F - String Compression
825F - String Compression 题意 给出一个字符串,你要把它尽量压缩成一个短的字符串,比如一个字符串ababab你可以转化成3ab,长度为 3,比如bbbacacb转化成3b2a ...