JS延迟加载加快页面打开速度示例代码


Posted in Javascript onDecember 30, 2013

第一,JS延迟加载

代码如下:

<script language="JavaScript" src="" id="my"></script> 
<script language="JavaScript"> 
setTimeout("document.getElementById('my').src='include/...文件...php'; ",3000);//延时3秒 
</script>

第二,JS最后加载

在需要插入JS的地方插入以下代码:

<SPAN id=L4EVER>LOADING...</SPAN>

当然,那个LOADING…你可以换成自己喜欢的小图片.看起来很有AJAX效果呢.

然后在页面最底端插入:

<SPAN class=spanclass id=AD_L4EVER> 
你的JS代码在这里!</SPAN> 
<script>L4EVER.innerHTML=AD_L4EVER.innerHTML;AD_L4EVER.innerHTML="";</script>

第三,JS最后加载

想要显示广告的位置
<div id="guangg1"></div>

想要显示的广告内容

<div id="ggad1" style="display:none"> 
<script language="javascript" src="/include/.......js"></script> 
</div>

判断要显示的广告位置是否存在
<script language="javascript"> 
function chkdiv(divid){ 
var chkid=document.getElementById(divid); 
if(chkid != null) 
{return true; } 
else 
{return false; } 
} 最后就是显示广告了 
if (chkdiv('guangg1')) { 
document.getElementById('guangg1').innerHTML= document.getElementById('ggad1').innerHTML; 
document.getElementById('ggad1').innerHTML=""; 
} 
</script>

setTimeout用法

setTimeout的标准语法是: setTimeout(表达式,时间(毫秒)) 两个参数.

在这里着重记下第一个参数是一个 function时的调用,假设是一个函数.

1.函数无参:

function alertV(){ alert("000"); }

当第一个参数不加引号("" 或 '')时,延迟一秒:
setTimeout(alertV,1000);

当第一个参数加上又引号时,延迟一秒:
setTimeout("alertV()",1000);

2. 函数有参:

function alertV(event){ alert("keyCode="+event.keyCode); }

此时应设置成:
setTimeout(function(){alertV(event);},1000); 不然会提示参数未定义.

Javascript 相关文章推荐
JS BASE64编码 window.atob(), window.btoa()
Mar 09 Javascript
JavaScript在IE中“意外地调用了方法或属性访问”
Nov 19 Javascript
javascript(jquery)利用函数修改全局变量的代码
Nov 02 Javascript
javaScript parseInt字符转化为数字函数使用小结
Nov 05 Javascript
ASP.NET中AJAX 调用实例代码
May 03 Javascript
扒一扒JavaScript 预解释
Jan 28 Javascript
JS+DIV+CSS实现的经典标签切换效果代码
Sep 14 Javascript
JS实现浏览器状态栏显示时间的方法
Oct 27 Javascript
JavaScript中循环遍历Array与Map的方法小结
Mar 12 Javascript
Vue使用vue-cli创建项目
Sep 01 Javascript
解决vue中post方式提交数据后台无法接收的问题
Aug 11 Javascript
谈谈JavaScript中super(props)的重要性
Feb 12 Javascript
深入理解javascript中return的作用
Dec 30 #Javascript
禁止IE用右键的JS代码
Dec 30 #Javascript
js将控件隐藏及display属性的使用介绍
Dec 30 #Javascript
JS的document.all函数使用示例
Dec 30 #Javascript
Jquery插件easyUi表单验证提交(示例代码)
Dec 30 #Javascript
结合JQ1.9通过js正则判断各种浏览器版本的方法
Dec 30 #Javascript
Jquery中&quot;$(document).ready(function(){ })&quot;函数的使用详解
Dec 30 #Javascript
You might like
php面向对象全攻略 (四)构造方法与析构方法
2009/09/30 PHP
PHP+MySQL高并发加锁事务处理问题解决方法
2018/04/30 PHP
PHP设计模式之建造者模式定义与用法简单示例
2018/08/13 PHP
laravel 去掉index.php伪静态的操作方法
2019/10/12 PHP
javascript中使用replaceAll()函数实现字符替换的方法
2010/12/25 Javascript
javascript对select标签的控制(option选项/select)
2013/01/31 Javascript
js采用map取到id集合组并且实现点击一行选中一行
2013/12/16 Javascript
使用AngularJS创建自定义的过滤器的方法
2015/06/18 Javascript
jQuery实现可展开合拢的手风琴面板菜单
2015/09/15 Javascript
原生javascript实现的一个简单动画效果
2016/03/30 Javascript
微信小程序 加载 app-service.js 错误解决方法
2016/10/12 Javascript
详解AngularJS1.6版本中ui-router路由中/#!/的解决方法
2017/05/22 Javascript
js array数组对象操作方法汇总
2019/03/18 Javascript
jsonp实现百度下拉框功能的方法分析
2019/05/10 Javascript
原生JS实现烟花效果
2020/03/10 Javascript
在VUE style中使用data中的变量的方法
2020/06/19 Javascript
React 条件渲染最佳实践小结(7种)
2020/09/27 Javascript
Python使用自带的ConfigParser模块读写ini配置文件
2016/06/26 Python
Python 基础教程之包和类的用法
2017/02/23 Python
python 多维切片之冒号和三个点的用法介绍
2018/04/19 Python
python时间与Unix时间戳相互转换方法详解
2020/02/13 Python
打包PyQt5应用时的注意事项
2020/02/14 Python
Python3.9.1中使用match方法详解
2021/02/08 Python
HTML5新增的标签和属性归纳总结
2018/05/02 HTML / CSS
C#面试问题
2016/07/29 面试题
编辑找工作求职信范文
2013/12/16 职场文书
社区优秀志愿者材料
2014/02/02 职场文书
cf战队收人广告词
2014/03/14 职场文书
《黄山奇石》教学反思
2014/04/19 职场文书
运动会演讲稿300字
2014/08/25 职场文书
工作试用期自我评价
2015/03/10 职场文书
会议通知格式范文
2015/04/15 职场文书
比赛口号霸气押韵
2015/12/24 职场文书
2016年机关单位节能宣传周活动总结
2016/04/05 职场文书
springboot layui hutool Excel导入的实现
2022/03/31 Java/Android
Vue2项目中对百度地图的封装使用详解
2022/06/16 Vue.js