JS实现iframe自适应高度的方法示例


Posted in Javascript onJanuary 07, 2017

本文实例讲述了JS实现iframe自适应高度的方法。分享给大家供大家参考,具体如下:

<iframe id="mainFrame" name="mainFrame" src="/zwgk/hsearchview" width="740" frameborder="0" scrolling="no" scrolling="no" frameborder="0" >
</iframe>
<script type="text/javascript" language="javascript">
function reinitIframe(){
 var iframe = document.getElementById("mainFrame");
 try{
 var bHeight = iframe.contentWindow.document.body.scrollHeight;
 var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;
 var height = Math.max(bHeight, dHeight);
 iframe.height = height;
 }catch (ex){}
 }
 window.setInterval("reinitIframe()", 100);
</script>

PS:高度自适应应用广泛,本站的很多在线工具也使用了这一技巧,列举如下几个工具供大家参考:

JavaScript在线格式化工具(基于beautify.js插件):
http://tools.3water.com/code/js_beautify

在线颜色选择器工具/RGB颜色查询对照表:
http://tools.3water.com/color/colorpicker

在线个人所得税计算器:
http://tools.3water.com/jisuanqi/tax_calc

宋词在线查询:
http://tools.3water.com/bianmin/songci

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Javascript操纵Cookie实现购物车程序
Nov 23 Javascript
jQuery select的操作实现代码
May 06 Javascript
Javascript倒计时页面跳转实例小结
Sep 11 Javascript
ExtJS[Desktop]实现图标换行示例代码
Nov 17 Javascript
在Iframe中获取父窗口中表单的值(示例代码)
Nov 22 Javascript
jquery如何扑捉回车键触发的事件
Apr 24 Javascript
jQuery检测某个元素是否存在代码分享
Jul 09 Javascript
简单掌握JavaScript中const声明常量与变量的用法
May 21 Javascript
使用Angular.js实现简单的购物车功能
Nov 21 Javascript
javascript中href和replace的比较(详解)
Nov 25 Javascript
javascript json对象小技巧之键名作为变量用法分析
Nov 11 Javascript
JavaScript命令模式原理与用法实例详解
Mar 10 Javascript
JS小数转换为整数的方法分析
Jan 07 #Javascript
jQuery日程管理插件fullcalendar使用详解
Jan 07 #Javascript
基于jquery二维码生成插件qrcode
Jan 07 #Javascript
jquery validation验证表单插件
Jan 07 #Javascript
JQuery ZTree使用方法详解
Jan 07 #Javascript
jquery实现转盘抽奖功能
Jan 06 #Javascript
BootStrap3中模态对话框的使用
Jan 06 #Javascript
You might like
2020显卡排行榜天梯图 显卡天梯图2020年3月最新版
2020/04/02 数码科技
php 图片上传类代码
2009/07/17 PHP
php下通过curl抓取yahoo boss 搜索结果的实现代码
2011/06/10 PHP
php读取csv文件并输出的方法
2015/03/14 PHP
php简单实现数组分页的方法
2016/04/30 PHP
php readfile()修改文件上传大小设置
2017/08/11 PHP
PHP实现数组根据某个单元字段排序操作示例
2018/08/01 PHP
一个js实现的所谓的滑动门
2007/05/23 Javascript
CLASS_CONFUSION JS混淆 全源码
2007/12/12 Javascript
Js点击弹出下拉菜单效果实例
2013/08/12 Javascript
javascript实现仿IE顶部的可关闭警告条
2015/05/05 Javascript
JS利用cookie记忆当前位置的防刷新导航效果
2015/10/15 Javascript
解决JavaScript数字精度丢失问题的方法
2015/12/03 Javascript
Angular设置title信息解决SEO方面存在问题
2016/08/19 Javascript
Bootstrap Navbar Component实现响应式导航
2016/10/08 Javascript
浅析javascript中的Event事件
2016/12/09 Javascript
vue2.0数据双向绑定与表单bootstrap+vue组件
2017/02/27 Javascript
JS计算距当前时间的时间差实例
2017/12/29 Javascript
JS中promise化微信小程序api
2018/04/12 Javascript
通过jquery获取上传文件名称、类型和大小的实现代码
2018/04/19 jQuery
在vue 中使用 less的教程详解
2018/09/26 Javascript
浅谈关于JS下大批量异步任务按顺序执行解决方案一点思考
2019/01/08 Javascript
[04:50]DOTA2亚洲邀请赛小组赛第四日 TOP10精彩集锦
2015/02/02 DOTA
网站渗透常用Python小脚本查询同ip网站
2017/05/08 Python
利用TensorFlow训练简单的二分类神经网络模型的方法
2018/03/05 Python
Python使用matplotlib 模块scatter方法画散点图示例
2019/09/27 Python
Python阶乘求和的代码详解
2020/02/14 Python
python微信公众号开发简单流程实现
2020/03/09 Python
pymysql之cur.fetchall() 和cur.fetchone()用法详解
2020/05/15 Python
举例详解HTML5中使用JSON格式提交表单
2015/06/16 HTML / CSS
Under Armour安德玛德国官网:美国高端运动科技品牌
2019/03/09 全球购物
儿科护士实习自我鉴定
2013/10/17 职场文书
学雷锋志愿服务月活动总结
2014/03/09 职场文书
《沙漠中的绿洲》教学反思
2014/04/24 职场文书
如何写贫困证明申请书
2014/10/29 职场文书
仓库保管员岗位职责
2015/02/09 职场文书