获取Iframe页面高度并赋值给Iframe以及获取iframe里的元素
最近接手了别人的项目,别人用到了iframe,自己在实战中总结了一些关于iframe的小问题。
获取Iframe页面高度并赋值给Iframe
Html
<iframe name="container_ifranme" id="iframeId" scrolling="no" frameborder="no" border="0" src="home.html" onLoad="iFrameHeight()" ></iframe>
Js
function iFrameHeight() {
var ifm= document.getElementById("iframeId");
var subWeb = document.frames ? document.frames["iframeId"].document : ifm.contentDocument;
if(ifm != null && subWeb != null) {
ifm.style.height = 'auto';//关键这一句,先取消掉之前iframe设置的高度
ifm.style.height = subWeb.body.scrollHeight+'px';
}
};
获取iframe里的元素
1,contentWindow:是用来获取子窗口的window对象的,它兼容各大浏览器,用法如下
document.getElementById("iframeId").contentWindow
这样简单的一句就得到了iframe包含页面的window对象;
2,contentDocument:是用来获取子窗口的document对象的,主流浏览器都支持和ie8+支持,用法如下
document.getElementById("iframeId").contentDocument
这样简单的一句就得到了iframe包含页面的document对象;
以上两种方法是在父窗口中获取到子窗口,既然我们都能拿到子窗口window对象和document对象了,那么子窗口内其他的操作就easy了 !
如果要通过子窗口A访问到同级的子窗口B,那么我们可以在子窗口A中这么来做:
parent.getElementById("iframeId").contentWindow.document.getElmentById("frameId_B")
或者parent.getElementById("iframeId").contentDocument.getElmentById("frameId_B")就得到B窗口了。
获取Iframe页面高度并赋值给Iframe以及获取iframe里的元素的更多相关文章
- html页面嵌套两个iframe页面导致第二个iframe页面高度失效的问题
1:这是因为最里面嵌套的iframe页面html和body高度无法设置问题,我的解决办法是js去控制iframe高度 2:js获取最子页面(content内容区域)的高度 var ifremHeigh ...
- 在Servlet端获取html页面选中的checkbox值,request获取页面checkbox(复选框)值
html端代码: 选项框: <input type="checkbox" name="crowd" value="选项一">选项 ...
- iframe 自适应高度、父子页面传值、回调
总结一下最近用iframe遇到的问题与解决办法: 结构:主页面main.html,里面套用iframe.iframe不能出现滚动条,自适应子页面高度.内容多了滚动条是main.html页面的. 1. ...
- iframe的高度自适应
http://www.cnblogs.com/snandy/p/3902337.html http://www.cnblogs.com/snandy/p/3900016.html Snandy Sto ...
- 同域iframe的高度自适应
引子 父页面里控制子页面 子页面里控制父页面 一.引子 我们先看一个示例,有两个页面,1.html通过iframe嵌入2.html,两个页面都是同域的 1.html <!DOCTYPE html ...
- JQuery iframe宽高度自适应浏览器窗口大小的解决方法
iframe宽高度自适应浏览器窗口大小的解决方法 by:授客 QQ:1033553122 1. 测试环境 JQuery-3.2.1.min.js 下载地址: https://gitee.com ...
- Asp.net MVC访问框架页中嵌套的iframe页面时,如果session或cookie过期,登录验证超时怎样自动跳转到登录页
一般登录验证的过滤器中,使用验证过滤器的Redirect方法,将请求重定向到指定的URL.但是如果我们要访问的页面是一个嵌套在框架页中的iframe页面时,这种重定向只会对iframe页面凑效,也就是 ...
- iframe自适应高度(转)
iframe自适应高度 (2013-04-23 17:29:49) 标签: iframe 高度 自适应 js 杂谈 分类: 网页制作 有时候我们的网站需要引入其他网站的东西,比如评论,这时候就需要使用 ...
- jquery获取高度错误(可以获取到宽度,但获取不到高度),及解决办法
<div class="foo"> <div style="display: none;"> 3333333 </div> ...
随机推荐
- CVE-2019-0686|Microsoft Exchange特权提升漏洞补丁已发布
Microsoft Exchange Server中存在一个特权提升漏洞.成功利用此漏洞的攻击者可以获得与Exchange服务器的任何其他用户相同的权限.这可能允许攻击者执行诸如访问其他用户的邮箱之类 ...
- Netty3:分隔符和定长解码器
回顾TCP粘包/拆包问题解决方案 上文详细说了TCP粘包/拆包问题产生的原因及解决方式,并以LineBasedFrameDecoder为例演示了粘包/拆包问题的实际解决方案,本文再介绍两种粘包/拆包问 ...
- EL表达式 if 和 if else语句的写法
JavaScript的if else大家都不会陌生,但可能很多小伙伴并不知道在jsp文件里,el表达式的if else是怎么写的,下面安利给各位小伙伴 el表达式 if 代码示例 <c:if t ...
- 学习pwn的前提工作及部分解决方案
一.Ubuntu 在VM安装64位的Ubuntu 二.pwntools 基本语法 sudo apt-get install libffi-dev sudo apt-get install libssl ...
- 【反编译系列】四、反编译so文件(IDA_Pro)
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 概述 安卓应用程序的开发语言是java,但是由于java层的代码很容易被反编译,而反编译c/c++程序的难度比较大,所以现在很多安卓应用程 ...
- [开发技巧]·AdaptivePooling与Max/AvgPooling相互转换
[开发技巧]·AdaptivePooling与Max/AvgPooling相互转换 个人网站--> http://www.yansongsong.cn/ 1.问题描述 自适应池化Adaptive ...
- 云HBase发布全文索引服务,轻松应对复杂查询
云HBase发布了“全文索引服务”功能,自2019年01月25日后创建的云HBase实例,可以在控制台免费开启此“全文索引服务”功能.使用此功能可以让用户在HBase之上构建功能更丰富的搜索业务,不再 ...
- JDBC事务控制
概念 事务(Transaction)是访问并可能更新数据库中各种数据项的一个程序执行单元(unit).事务通常由高级数据库操纵语言或编程语言(如SQL,C++或Java)书写的用户程序的执行所引起,并 ...
- WebSocketSharp 的使用
Server 端示例代码: class Program { static void Main(string[] args) { var wssv = new WebSocketServer(" ...
- CVE-2017-1000405 利用脏牛漏洞Linux提权复现
当前路径: /var/www 磁盘列表: / 系统信息: Linux zico 3.2.0-23-generic #36-Ubuntu SMP Tue Apr 10 20:39:51 UTC 2012 ...