延时加载JavaScript代码提高速度


Posted in Javascript onDecember 27, 2015

延时加载js代码提高速度,具体内容如下所示:

如果网页中存在大量的javascript代码会极大的影响网页的访问速度,下面就简单介绍一下如何处理此问题。

一.延时加载js文件:

可以使用定时器函数setTimeout()让外部的js文件延迟加载,例如:

<script type="text/javascript" src="" id="my"></script> 
<script type="text/javascript"> 
var js=document.getElementById("my"); 
function addjs(){
 js.src="js/js.js"; 
}
setTimeout(addjs,3000);
</script>

以上代码可以实现js代码咋3秒之后再加载,这样可以在一定程度上提高速度。

二.将js代码放到网页内容的后面:

这个比较简单了,就不用说了,就是将js代码放在网页内容的后面,一把是放在body的最底部,这样也可以先加载内容再去执行js代码,也能够提高一定的速度。

下面给大家介绍JS广告代码延迟加载或是最后加载加快页面载入

JS广告代码延迟加载或是最后加载加快页面载入,如果页面中有很多JS广告代码,或者其他的js/' target='_blank' class='u'>JS代码太大,这时候加载起来就会很费时间。使用JS广告代码延迟加载或是最后加载的方法以加快页面载入速度。

第一,JS延迟加载

代码如下:

<script language="JavaScript" src="" id="my"></script>
<script>
setTimeout("document.getElementById('my').src='include/php100.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最后加载

想要显示JS广告代码的位置

<div id="guangg1"></div>

想要显示的广告内容

<div id="ggad1"><script language="javascript"
src="/frontpage/include/php100.js"></script></div>

判断要显示的广告位置是否存在

<script>
function chkdiv(divid){
var chkid=document.getElementById(divid);
if(chkid != null)
{return true; }
else
{return false; }
}   最后就是显示JS广告代码了
if (chkdiv('guangg1')) {
document.getElementById('guangg1').innerHTML= document.getElementById('ggad1').innerHTML;
document.getElementById('ggad1').innerHTML="";
}
</script>
Javascript 相关文章推荐
javascript html 静态页面传参数
Apr 10 Javascript
jQeury淡入淡出需要注意的问题
Sep 08 Javascript
js+css实现增加表单可用性之提示文字
Jun 03 Javascript
javascript验证身份证完全方法具体实现
Nov 18 Javascript
javascript中打印当前的时间实现思路及代码
Dec 18 Javascript
JavaScript学习笔记之定时器
Jan 22 Javascript
全面解析Bootstrap手风琴效果
Apr 17 Javascript
基于JS实现二维码图片固定在右下角某处并跟随滚动条滚动
Feb 08 Javascript
微信小程序实现添加手机联系人功能示例
Nov 30 Javascript
Angular2实现组件交互的方法分析
Dec 19 Javascript
如何用vue-cli3脚手架搭建一个基于ts的基础脚手架的方法
Dec 12 Javascript
vue实现水波涟漪效果的点击反馈指令
May 31 Vue.js
AngularJS使用ngMessages进行表单验证
Dec 27 #Javascript
详解maxlength属性在textarea里奇怪的表现
Dec 27 #Javascript
SublimeText自带格式化代码功能之reindent
Dec 27 #Javascript
Javascript removeChild()删除节点及删除子节点的方法
Dec 27 #Javascript
JavaScript的removeChild()函数用法详解
Dec 27 #Javascript
JavaScript构造函数详解
Dec 27 #Javascript
JavaScript生成二维码图片小结
Dec 27 #Javascript
You might like
生成卡号php代码
2008/04/09 PHP
PHP Session_Regenerate_ID函数双释放内存破坏漏洞
2011/01/27 PHP
PHP Global定义全局变量使用说明
2013/08/15 PHP
如何让页面在打开时自动刷新一次让图片全部显示
2012/12/17 Javascript
JS中setInterval、setTimeout不能传递带参数的函数的解决方案
2013/04/28 Javascript
javascript打印输出json实例
2013/11/11 Javascript
Bootstrap Table表格一直加载(load)不了数据的快速解决方法
2016/09/17 Javascript
利用React-router+Webpack快速构建react程序
2016/10/27 Javascript
Map.vue基于百度地图组件重构笔记分享
2017/04/17 Javascript
详解如何使用vue-cli脚手架搭建Vue.js项目
2017/05/19 Javascript
微信小程序开发之animation循环动画实现的让云朵飘效果
2017/07/14 Javascript
JS图片延迟加载插件LazyImgv1.0用法分析【附demo源码下载】
2017/09/04 Javascript
详谈构造函数加括号与不加括号的区别
2017/10/26 Javascript
JS字符串去除连续或全部重复字符的实例
2018/03/08 Javascript
ztree加载完成后显示勾选节点的实现代码
2018/10/22 Javascript
详解小程序不同页面之间通讯的解决方案
2018/11/23 Javascript
vuex页面刷新后数据丢失的方法
2019/01/17 Javascript
js实现盒子拖拽动画效果
2020/08/09 Javascript
python3.x实现发送邮件功能
2018/05/22 Python
解决Python print 输出文本显示 gbk 编码错误问题
2018/07/13 Python
浅谈Python编程中3个常用的数据结构和算法
2019/04/30 Python
python识别图像并提取文字的实现方法
2019/06/28 Python
对python中url参数编码与解码的实例详解
2019/07/25 Python
python requests模拟登陆github的实现方法
2019/12/26 Python
最新Python idle下载、安装与使用教程图文详解
2020/11/28 Python
新西兰购物网站:TheMarket NZ
2020/09/19 全球购物
诉讼代理人授权委托书
2014/04/08 职场文书
小摄影师教学反思
2014/04/27 职场文书
妇联领导班子剖析材料
2014/08/21 职场文书
初中生旷课检讨书范文
2014/10/06 职场文书
2014年个人工作总结模板
2014/12/15 职场文书
2014年校务公开工作总结
2014/12/18 职场文书
八年级作文之感悟亲情
2019/11/20 职场文书
MySQL创建索引需要了解的
2021/04/08 MySQL
python常见的占位符总结及用法
2021/07/02 Python