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 相关文章推荐
Jquery AutoComplete自动完成 的使用方法实例
Mar 19 Javascript
JavaScript获取当前cpu使用率的方法
Dec 15 Javascript
CSS或者JS实现鼠标悬停显示另一元素
Jan 22 Javascript
关于获取DIV内部内容报错的原因分析及解决办法
Jan 29 Javascript
基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)
Jun 22 Javascript
javascript特效实现——当前时间和倒计时效果的简单实例
Jul 20 Javascript
js实现多图左右切换功能
Aug 04 Javascript
jQuery插件FusionWidgets实现的Bulb图效果示例【附demo源码下载】
Mar 23 jQuery
React父子组件间的传值的方法
Nov 13 Javascript
用Vue.js在浏览器中实现裁剪图像功能
Jun 18 Javascript
微信小程序 冒泡事件原理解析
Sep 27 Javascript
基于 Vue 的 Electron 项目搭建过程图文详解
Jul 22 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实现字符串反转输出的方法
2015/03/14 PHP
PHP正则获取页面所有图片地址
2016/03/23 PHP
PHP获取数组中指定的一列实例
2017/12/27 PHP
Javascript 面向对象 继承
2010/05/13 Javascript
jQuery源码分析-03构造jQuery对象-源码结构和核心函数
2011/11/14 Javascript
固定背景实现的背景滚动特效示例分享
2013/05/19 Javascript
Jquery实现视频播放页面的关灯开灯效果
2013/05/27 Javascript
鼠标经过显示二级菜单js特效
2013/08/13 Javascript
javascript作用域和闭包使用详解
2014/04/25 Javascript
JS烟花背景效果实现方法
2015/03/03 Javascript
基于jQuery实现响应式圆形图片轮播特效
2015/11/25 Javascript
javascript HTML5 canvas实现打砖块游戏
2020/06/18 Javascript
JS实现鼠标框选效果完整实例
2016/06/20 Javascript
Javascript 实现简单计算器实例代码
2016/10/23 Javascript
JS给Array添加是否包含字符串的简单方法
2016/10/29 Javascript
原生JS下拉加载插件分享
2016/12/26 Javascript
浅谈ajax请求不同页面的微信JSSDK问题
2018/02/26 Javascript
Vue常用的几个指令附完整案例
2018/11/06 Javascript
微信小程序-form表单提交代码实例
2019/04/29 Javascript
使用Vue实现一个树组件的示例
2020/11/06 Javascript
vue 获取到数据但却渲染不到页面上的解决方法
2020/11/19 Vue.js
[56:01]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 Effect vs EG
2018/03/31 DOTA
Python使用pymongo模块操作MongoDB的方法示例
2018/07/20 Python
Python使用itchat模块实现简单的微信控制电脑功能示例
2019/08/26 Python
django框架使用views.py的函数对表进行增删改查内容操作详解【models.py中表的创建、views.py中函数的使用,基于对象的跨表查询】
2019/12/12 Python
python 负数取模运算实例
2020/06/03 Python
Python3.9.1中使用match方法详解
2021/02/08 Python
从当地商店送来的杂货:Instacart
2018/08/19 全球购物
阿玛尼美妆俄罗斯官网:Giorgio Armani Beauty RU
2020/07/19 全球购物
大专毕业生简历的自我评价
2013/10/20 职场文书
物业管理专业个人的自我评价
2013/11/19 职场文书
北京奥运会主题口号
2014/06/13 职场文书
2016参观监狱警示教育活动心得体会
2016/01/15 职场文书
python 遍历磁盘目录的三种方法
2021/04/02 Python
Java由浅入深通关抽象类与接口(下篇)
2022/04/26 Java/Android
SpringBoot项目多数据源及mybatis 驼峰失效的问题解决方法
2022/07/07 Java/Android