延时加载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调试工具(下载)
Jan 09 Javascript
javascript 鼠标悬浮图片显示原图 移出鼠标后原图消失(多图)
Dec 28 Javascript
extjs tabpanel限制选项卡数量实现思路及代码
Apr 02 Javascript
Javascript和Java获取各种form表单信息的简单实例
Feb 14 Javascript
js中 javascript:void(0) 用法详解
Aug 11 Javascript
JavaScript中的遍历详解(多种遍历)
Apr 07 Javascript
vue数据双向绑定的注意点
Jun 23 Javascript
vuex直接赋值的三种方法总结
Sep 16 Javascript
Vux+Axios拦截器增加loading的问题及实现方法
Nov 08 Javascript
Vue中util的工具函数实例详解
Jul 08 Javascript
vue实现将一个数组内的相同数据进行合并
Nov 07 Javascript
js绘制一条直线并旋转45度
Aug 21 Javascript
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
DOTA2 1月28日更新:监管系统降临刀塔世界
2021/01/28 DOTA
PHP网站基础优化方法小结
2008/09/29 PHP
php获取客户端电脑屏幕参数的方法
2015/01/09 PHP
PHP批量生成图片缩略图的方法
2015/06/18 PHP
php根据用户语言跳转相应网页
2015/11/04 PHP
使javascript也能包含文件
2006/10/26 Javascript
document.designMode的功能与使用方法介绍
2007/11/22 Javascript
JS分页效果示例
2013/10/11 Javascript
Jquery 改变radio/checkbox选中状态,获取选中的值(示例代码)
2013/12/12 Javascript
DOM基础教程之使用DOM + Css
2015/01/20 Javascript
详解JavaScript正则表达式中的global属性的使用
2015/06/16 Javascript
javascript中window.open在原来的窗口中打开新的窗口(不同名)
2015/11/15 Javascript
JS中多步骤多分步的StepJump组件实例详解
2016/04/01 Javascript
基于nodejs res.end和res.send的区别
2018/05/14 NodeJs
vue-router中scrollBehavior的巧妙用法
2018/07/09 Javascript
vue项目使用微信公众号支付总结及遇到的坑
2018/10/23 Javascript
vue实现动态表格提交参数动态生成控件的操作
2020/11/09 Javascript
[01:07:19]DOTA2-DPC中国联赛 正赛 CDEC vs XG BO3 第一场 1月19日
2021/03/11 DOTA
在Linux下调试Python代码的各种方法
2015/04/17 Python
Python实现对PPT文件进行截图操作的方法
2015/04/28 Python
编写Python脚本批量下载DesktopNexus壁纸的教程
2015/05/06 Python
详解Python中dict与set的使用
2015/08/10 Python
Python实现MySQL操作的方法小结【安装,连接,增删改查等】
2017/07/12 Python
Python分治法定义与应用实例详解
2017/07/28 Python
django 开发忘记密码通过邮箱找回功能示例
2018/04/17 Python
python 找出list中最大或者最小几个数的索引方法
2018/10/30 Python
selenium+python自动化测试之使用webdriver操作浏览器的方法
2019/01/23 Python
python 同时读取多个文件的例子
2019/07/16 Python
Python post请求实现代码实例
2020/02/28 Python
pandas处理csv文件的方法步骤
2020/10/16 Python
澳大利亚玩具剧场:Toy Playhouse
2019/03/03 全球购物
低碳环保倡议书
2014/04/14 职场文书
2014年党员自我评议对照检查材料
2014/09/20 职场文书
2014镇党委书记党建工作汇报材料
2014/11/02 职场文书
2015年教师节演讲稿范文
2015/03/19 职场文书
婚礼嘉宾致辞
2015/07/28 职场文书