js获取iframe和父级之间元素,方法、属,获取iframe的高度自适应iframe高度
摘自:http://blog.csdn.net/kongjiea/article/details/38870399
1、在父页面 获取iframe子页面的元素
(在同域的情况下 且在http://下测试,且最好在iframe onload加载完毕后 dosomething...)
js写法
a、同过contentWindow获取
也有用contentDocument 获取的 但是contentWindow 兼容各个浏览器,可取得子窗口的 window 对象。
contentDocument Firefox 支持,> ie8 的ie支持。可取得子窗口的 document 对象。
获取方法
- var frameWin=document.getElementById('iframe').contentWindow; //window对象
- var frameDoc=document.getElementById('iframeId').contentWindow.document //document对象
- var frameBody=document.getElementById('iframeId').contentWindow.document.body //body对象
还有iframe.contentDocument 方法 //但是ie 6,7不支持
b、通过frames[]数组获取
(但是必须在ifram框架加载完毕后获取,iframe1是iframe的name属性)
- document.getElementById('iframId').onload=function(){
- var html= window.frames["name属性"].document.getElementById('iframe中的元素的id').innerHTML;
- alert(html)
- }
- 如果要获取iframe中的iframe
- document.getElementById('iframId').onload=function(){
- var html= window.frames["name属性"].frames["name属性"].document.getElementById('iframe中的元素的id').innerHTML;
- alert(html)
- }
jq写法:必须在iframe加载完毕以后才有效
- a、$("#iframe的ID").contents().find("#iframe中的控件ID").click();//jquery 方法1 必须在iframe加载完后才有效
- b、$("#iframe中的控件ID",document.frames("frame的name").document)//方法2 <span style="font-family: Arial, Helvetica, sans-serif;">必须在iframe加载完后才有效</span>
=================================
2、在iframe中获取父级页面的id元素
(在同域的情况下且在http://下测试,最好是 iframe记载完毕再dosomething)
js写法:
获取父级中的objid
- var obj=window.parent.document.getElementById('objId')
window.top 方法可以获取父级的父级的....最顶层的元素对象
jq写法:
- $('#父级窗口的objId', window.parent.document).css('height':'height); // window可省略不写
- 或者
- $(window.parent.document).find("#objId").css('height':'height); // window可省略不写
===================================
3、父级窗体访问iframe中的属性
(经测试,在ie中最好用原生的onload事件,如果用jq的load把iframe加载完毕 有时候方法调用不到 多刷新才有效果)
- a、 用contentWindow方法
- document.getElementById('iframe1').onload=function(){
- this.contentWindow.run();
- }
- b、用iframes[]框架集数组方法
- document.getElementById('iframe1').onload=function(){
- frames["iframe1"].run();
- }
===================================
4、在iframe中访问父级窗体的方法和属性 //window 可以不写
- window.parent.attributeName; // 访问属性attributeName是在父级窗口的属性名
- window.parent.Func(); // 访问属性Func()是在父级窗口的方法
5、让iframe自适应高度
- $('#iframeId').load(function() { //方法1
- var iframeHeight = Math.min(iframe.contentWindow.window.document.documentElement.scrollHeight, iframe.contentWindow.window.document.body.scrollHeight);
- var h=$(this).contents().height();
- $(this).height(h+'px');
- });
- $('#iframeId').load(function() { //方法2
- var iframeHeight=$(this).contents().height();
- $(this).height(iframeHeight+'px');
- });
6、iframe的onload的事件,
7、在iframe所引入的网址写入防钓鱼代码
window.top.location.href=window.location.href;
}
8、获取iframe的高度
js获取iframe和父级之间元素,方法、属,获取iframe的高度自适应iframe高度的更多相关文章
- js获取iframe中的元素以及在iframe中获取父级的元素(包括iframe中不存在name和id的情况)
第一种情况:iframe中不存在name和id的方法:(通过contentWindow获取) var iframe = document.getElementsByTagName('iframe' ...
- iframe里访问父级里的方法属性
window.parent.attributeName; // 访问属性attributeName是在父级窗口的属性名 window.parent.Func(); // 访问属性Func()是在父 ...
- Js/Jquery获取iframe中的元素 在Iframe中获取父窗体的元素方法
在web开发中,经常会用到iframe,难免会碰到需要在父窗口中使用iframe中的元素.或者在iframe框架中使用父窗口的元素 js 在父窗口中获取iframe中的元素 1. 格式:window ...
- 在iframe窗体内 获取父级的元素;;在父窗口中获取iframe中的元素
在iframe中获取父窗口的元素 $(‘#父窗口中的元素ID’, parent.document).click(); 在父窗口中获取iframe中的元素 $(“#iframe的ID”).content ...
- Js跨域、父级窗口执行JS赋值、取值,更改元素
网站域名: A:http://www.xxoo.com/a.html B:http://www.aabb.com/b.html B网站嵌套与A网站(A的a中的Iframe指向B中的b)b要让父级a页面 ...
- 在iframe的父级作用域操作,ifame中的元素。。
frames["iframe的name"].SchDatas SchDatas为方法名js中 frames["iframe的name"].document.ge ...
- dirname的用法:获取文件的父级目录路径
命令:dirname 获取文件的路径(到父级目录)用法:dirname file_name [root@bogon opt]# a=$(dirname /mnt/a/b/c/d/a.sh) [root ...
- javascript父级鼠标移入移出事件中的子集影响父级的处理方法
一.我们先分析其产生的原因: 1.当鼠标从父级移入子集时触发了父级的两个事件:a.父级的mouseout事件(父级离开到子集):b.由于事件冒泡影响,又触发了父级的mouseover事件(父级移入父级 ...
- Easyui弹出窗体在iframe的父级页面显示
今天做EasyUI学习的预到了一个这样的问题:通过iframe加载的一个页面在调用$.messager.alert();这个方法后只能在iframe中显示alert效果而不是在全局的页面上显示这并不我 ...
随机推荐
- 第二百二十七节,jQuery EasyUI,ComboTree(树型下拉框)组件
jQuery EasyUI,ComboTree(树型下拉框)组件 学习要点: 1.加载方式 2.属性列表 3.方法列表 本节课重点了解EasyUI中ComboTree(树型下拉框)组件的使用方法,这个 ...
- 【vijos】1791 骑士的旅行(特殊的技巧)
https://vijos.org/p/1791 暴力的话只想到bfs,然后估计是状态超了才得20分. 噗,为啥暴力就不能想得简单点QAQ.....这种思想很好啊. 这一题我看了题解后不得不说我竟然没 ...
- 【POJ】2942 Knights of the Round Table(双连通分量)
http://poj.org/problem?id=2942 各种逗.... 翻译白书上有:看了白书和网上的标程,学习了..orz. 双连通分量就是先找出割点,然后用个栈在找出割点前维护子树,最后如果 ...
- linux程序设计——主机字节序和网络字节序(第十五章)
15.2.10 主机字节序和网络字节序 当在基于intel处理器的linux机器上执行新版本号的server和客户程序时,能够用netstat命令查看网络连接状况.它显示了客户/server连接 ...
- mysql delimiter 存储过程
命令行登录mysql cd /d D:\database\mysql1\bin mysql.exe -P 3306 -h 127.0.0.1 -u root -p USE tbschedule del ...
- Wise 打包细节
细节 说明 添加卸载快捷方式 缺省的安装程序快捷方式中没有卸载项:只能通过控制面板删除,或者主程序目录下的UnWise.exe来卸载.实际上,该文件就可以作为卸载程序. 可以复制一个快捷方式,将程序名 ...
- ChemDraw的“键”工具的作用是什么
ChemDraw的“键”工具在化学研究中能够发挥重大作用,如果你也是一名化学相关工作者就千万不要错过这篇教程,下文详细盘点“键”工具究竟能干些什么. ChemDraw化学软件免费获取地址:http:/ ...
- php数据库操作命令精华大全
1.表结构//列信息2.表数据//行信息3.表索引//把列中的行加到索引中(一般情况下一个表一定要把id这一列的所有数据都加到主键索引中) 2.[dos下]关闭mysql:net stop mysql ...
- ios APP 在 waiting for review时重新上传程序
今天上传程序后发现了一个挺大的bug,想重新上传app,于是搜了一下,现记录一下: 点击details进入后在link点击binary details,进入之后点击右上角reject this bin ...
- 【BZOJ4566】[Haoi2016]找相同字符 后缀数组+单调栈
[BZOJ4566][Haoi2016]找相同字符 Description 给定两个字符串,求出在两个字符串中各取出一个子串使得这两个子串相同的方案数.两个方案不同当且仅当这两 个子串中有一个位置不同 ...