框架页面高度自动刷新的Javascript脚本


Posted in Javascript onNovember 01, 2013

实现原理:加载index.htm时候,每隔1秒钟自动调用脚本刷新框架页面代码
代码优点:只需要设置index.html框架页面中的脚本,调用加载的子页面中不需要设置任何代码。
index.htm代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>首页</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
</head> 
<body> 
<div style="float: left; width: 740px; height:auto; border: 1px #808080 Solid; margin: 5px 0px 5px 10px;overflow: hide"> 
<iframe name="ifr_obj" id="ifr_obj" src="这里嵌套其它页面地址或者文件名" frameborder="0" width="100%" scrolling="no" title="框架页面"></iframe> 
</div> 
</body> 
<script language="javascript" type="text/javascript"> 
function initIframeHeight() { 
try { 
var iframe = document.getElementById("ifr_obj"); 
if (iframe != null) { 
if (iframe.contentWindow.document.body != null) { 
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) { 
alert("加载框架页面高度时出错"+ex.toString()); 
} 
} 
window.setInterval("initIframeHeight()", 1000); 
</script> 
</html>
Javascript 相关文章推荐
非常棒的10款jQuery 幻灯片插件
Jun 14 Javascript
StringTemplate遇见jQuery冲突的解决方法
Sep 22 Javascript
JavaScript实现获取某个元素相邻兄弟节点的prev与next方法
Jan 25 Javascript
关于JS变量和作用域详解
Jul 28 Javascript
Ajax跨域实现代码(后台jsp)
Jan 21 Javascript
jQuery中 bind的用法简单介绍
Feb 13 Javascript
详解vue2.0的Element UI的表格table列时间戳格式化
Jun 13 Javascript
react系列从零开始_简单谈谈react
Jul 06 Javascript
js 毫秒转天时分秒的实例
Nov 17 Javascript
原生js+cookie实现购物车功能的方法分析
Dec 21 Javascript
JavaScript使用享元模式实现文件上传优化操作示例
Aug 07 Javascript
Vue实现点击当前元素以外的地方隐藏当前元素(实现思路)
Dec 04 Javascript
JS滚轮事件onmousewheel使用介绍
Nov 01 #Javascript
JS实现拖动示例代码
Nov 01 #Javascript
多种方法实现JS动态添加事件
Nov 01 #Javascript
基于jquery插件实现常见的幻灯片效果
Nov 01 #Javascript
jQuery Mobile 导航栏代码
Nov 01 #Javascript
js将json格式内容转换成对象的方法
Nov 01 #Javascript
JS实现切换标签页效果实例代码
Nov 01 #Javascript
You might like
Laravel框架表单验证详解
2014/09/04 PHP
PHP实现PDO的mysql数据库操作类
2014/12/12 PHP
PHP的openssl加密扩展使用小结(推荐)
2016/07/18 PHP
PHP闭包定义与使用简单示例
2018/04/13 PHP
php-fpm中max_children的配置
2019/03/15 PHP
JavaScript中的类继承
2010/11/25 Javascript
按下回车键指向下一个位置的一个函数代码
2014/03/10 Javascript
jquery跟随屏幕滚动效果的实现代码
2016/04/13 Javascript
jQuery Easyui Datagrid实现单行的上移下移及保存移动的结果
2016/08/15 Javascript
jQuery向webApi提交post json数据
2017/01/16 Javascript
JavaScript html5利用FileReader实现上传功能
2020/03/27 Javascript
详解vue项目构建与实战
2017/06/27 Javascript
vue+webpack实现异步加载三种用法示例详解
2018/04/24 Javascript
微信小程序实现人脸检测功能
2018/05/25 Javascript
vuex 解决报错this.$store.commit is not a function的方法
2018/12/17 Javascript
微信小程序页面间传值与页面取值操作实例分析
2019/04/30 Javascript
详解vue 在移动端体验上的优化解决方案
2019/05/20 Javascript
原生js实现ajax请求和JSONP跨域请求操作示例
2020/03/14 Javascript
JavaScript Image对象实现原理实例解析
2020/08/26 Javascript
jQuery使用hide()、toggle()函数实现相机品牌展示隐藏功能
2021/01/29 jQuery
[03:52]DOTA2英雄基础教程 酒仙
2013/12/23 DOTA
Python Web程序部署到Ubuntu服务器上的方法
2018/02/22 Python
pandas DataFrame 删除重复的行的实现方法
2019/01/29 Python
python多线程并发实例及其优化
2019/06/27 Python
使用Puppeteer爬取微信文章的实现
2020/02/11 Python
CSS3实现翘边的阴影效果的代码示例
2016/06/13 HTML / CSS
.NET面试问题集
2015/12/08 面试题
小班重阳节活动方案
2014/02/08 职场文书
材料化学专业求职信
2014/07/15 职场文书
建设工程授权委托书
2014/09/22 职场文书
2014年大学生村官工作总结
2014/11/19 职场文书
英文导游词
2015/02/13 职场文书
小学教研工作总结2015
2015/05/13 职场文书
总结会主持词
2015/07/02 职场文书
新学期主题班会
2015/08/17 职场文书
PyTorch的Debug指南
2021/05/07 Python