js 延迟加载 改变JS的位置加快网页加载速度


Posted in Javascript onDecember 11, 2012

当一个网站有很多js代码要加载,js代码放置的位置在一定程度上将会影像网页的加载速度,为了让我们的网页加载速度更快,本文总结了一下几个注意点:
1、延迟加载js代码

<script type=”text/javascript” src=”" id=”my”></script> 
<script type=”text/javascript”> 
setTimeout(“document.getElementById(‘my').src='include/php100.php'; “,3000);//延时3秒 
</script>

这样通过延迟加载js代码,给网页加载留出更多的时间!

2、js最后加载方案一
在需要插入JS的地方插入以下代码:
程序代码

<span id=”L4EVER”>LOADING…</span>

当然,那个LOADING…你可以换成自己喜欢的小图片.看起来很有AJAX效果呢.
然后在页面最底端插入:
程序代码
<span id=”AD_L4EVER”>你的JS代码在这里!</span > 
<script>L4EVER.innerHTML=AD_L4EVER.innerHTML;AD_L4EVER.innerHTML=”";</script>

3、让JS最后加载方案二
这个牵涉到网页的加载顺序问题,例如引入外部js脚本文件时,如果放入html的head中,则页面加载前该js脚本就会被加载入页面,而放入body中,则会按照页面从上倒下的加载顺序来运行javascript的代码~~~ 所以我们可以把js外部引入的文件放到页面底部,来让js最后引入,从而加快页面加载速度。
Javascript 相关文章推荐
jQuery $.each的用法说明
Mar 22 Javascript
Jquery公告滚动+AJAX后台得到数据
Apr 14 Javascript
javascript框架设计读书笔记之数组的扩展与修复
Dec 02 Javascript
Javascript基础教程之argument 详解
Jan 18 Javascript
javascript实现html页面之间参数传递的四种方法实例分析
Dec 15 Javascript
jQuery Timelinr实现垂直水平时间轴插件(附源码下载)
Feb 16 Javascript
精彩的Bootstrap案例分享 重点在注释!(选项卡、栅格布局)
Jul 01 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(同步显示图像位置信息)
Dec 02 Javascript
JS作用域链详解
Jun 26 Javascript
解决Can't find variable: SockJS vue项目的问题
Sep 22 Javascript
深入了解Vue3模板编译原理
Nov 19 Vue.js
JS新手入门数组处理的实用方法汇总
Apr 07 Javascript
js控制CSS样式属性语法对照表
Dec 11 #Javascript
javascript向flash swf文件传递参数值注意细节
Dec 11 #Javascript
ajax的hide隐藏问题解决方法
Dec 11 #Javascript
ajax上传时参数提交不更新等相关问题
Dec 11 #Javascript
jQuery(非HTML5)可编辑表格实现代码
Dec 11 #Javascript
jQuery使用数组编写图片无缝向左滚动
Dec 11 #Javascript
如何获取JQUERY AJAX返回的JSON结果集实现代码
Dec 10 #Javascript
You might like
再Docker中架设完整的WordPress站点全攻略
2015/07/29 PHP
对于Laravel 5.5核心架构的深入理解
2018/02/22 PHP
js数组去重的常用方法总结
2014/01/24 Javascript
Javascript模块化编程详解
2014/12/01 Javascript
js添加绑定事件的方法
2016/05/15 Javascript
详解Nodejs的timers模块
2016/12/22 NodeJs
javascript中apply/call和bind的使用
2017/02/15 Javascript
详解angularjs利用ui-route异步加载组件
2017/05/21 Javascript
如何编写一个d.ts文件的步骤详解
2018/04/13 Javascript
解决Angularjs异步操作后台请求用$q.all排列先后顺序问题
2019/11/29 Javascript
vue中v-for循环选中点击的元素并对该元素添加样式操作
2020/07/17 Javascript
Python实现决策树C4.5算法的示例
2018/05/30 Python
python 字典修改键(key)的几种方法
2018/08/10 Python
python 定时器,实现每天凌晨3点执行的方法
2019/02/20 Python
Python八皇后问题解答过程详解
2019/07/29 Python
django自带serializers序列化返回指定字段的方法
2019/08/21 Python
python 利用pyttsx3文字转语音过程详解
2019/09/25 Python
python中Lambda表达式详解
2019/11/20 Python
Python多个装饰器的调用顺序实例解析
2020/05/22 Python
浅谈keras中的后端backend及其相关函数(K.prod,K.cast)
2020/06/29 Python
Pytho爬虫中Requests设置请求头Headers的方法
2020/09/22 Python
美国销售第一的智能手机和平板电脑保护壳:OtterBox
2017/12/21 全球购物
Hashtable 添加内容的方式有哪几种,有什么区别?
2012/04/08 面试题
应用电子技术专业个人求职信
2013/09/21 职场文书
机电一体化专业应届本科生求职信
2013/09/27 职场文书
中班上学期幼儿评语
2014/04/30 职场文书
英文推荐信格式范文
2014/05/09 职场文书
校优秀毕业生主要事迹
2014/05/26 职场文书
预备党员个人总结
2015/02/14 职场文书
酒店辞职书怎么写
2015/02/26 职场文书
2016党校学习心得体会
2016/01/07 职场文书
2019最新激励员工口号大全!
2019/06/28 职场文书
导游词之峨眉山
2019/12/16 职场文书
Python中OpenCV实现查找轮廓的实例
2021/06/08 Python
Python中time标准库的使用教程
2022/04/13 Python
Javascript webpack动态import
2022/04/19 Javascript