几种延迟加载JS代码的方法加快网页的访问速度


Posted in Javascript onOctober 12, 2013

本文介绍了如何延迟javascript代码的加载,加快网页的访问速度。

当一个网站有很多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增加join方法的实现代码
Nov 28 Javascript
jquery ui dialog ie8出现滚动条的解决方法
Dec 06 Javascript
javascript学习笔记(五) Array 数组类型介绍
Jun 19 Javascript
javascript操作字符串的原生方法
Dec 22 Javascript
js实现表单Radio切换效果的方法
Aug 17 Javascript
a标签跳转到指定div,jquery添加和移除class属性的实现方法
Oct 10 Javascript
浅谈js键盘事件全面控制
Dec 01 Javascript
获取select的value、text值的简单示例(jquery与javascript)
Dec 07 Javascript
深入讲解xhr(XMLHttpRequest)/jsonp请求之abort
Jul 26 Javascript
Node.js Event Loop各阶段讲解
Mar 08 Javascript
vue中使用vee-validator完成表单校验方案
Nov 01 Javascript
测量JavaScript函数的性能各种方式对比
Apr 27 Javascript
JavaScript如何从listbox里同时删除多个项目
Oct 12 #Javascript
javascript动态的改变IFrame的高度实现自动伸展
Oct 12 #Javascript
JavaScript var声明变量背后的原理示例解析
Oct 12 #Javascript
原生js操作checkbox用document.getElementById实现
Oct 12 #Javascript
基于jquery的9行js轻松实现tab控件示例
Oct 12 #Javascript
JavaScript对象学习经验整理
Oct 12 #Javascript
js修改input的type属性问题探讨
Oct 12 #Javascript
You might like
php实现MD5加密16位(不要默认的32位)
2013/08/12 PHP
PHP浮点数的一个常见问题
2016/03/10 PHP
php+javascript实现的动态显示服务器运行程序进度条功能示例
2017/08/07 PHP
PHP实时统计中文字数和区别
2019/02/28 PHP
Laravel 将数据表的数据导出,并生成seeds种子文件的方法
2019/10/09 PHP
javascript 日期时间函数(经典+完善+实用)
2009/05/27 Javascript
浅析JQuery获取和设置Select选项的常用方法总结
2013/07/04 Javascript
JavaScript中的prototype.bind()方法介绍
2014/04/04 Javascript
jquery实现华丽的可折角广告代码
2015/09/02 Javascript
js的各种排序算法实现(总结)
2016/07/23 Javascript
微信小程序网络请求的封装与填坑之路
2017/04/01 Javascript
React Native时间转换格式工具类分享
2017/10/24 Javascript
手机注册发送验证码倒计时的简单实例
2017/11/15 Javascript
利用ES6实现单例模式及其应用详解
2017/12/09 Javascript
layui点击导航栏刷新tab页的示例代码
2018/08/14 Javascript
JS实现的冒泡排序,快速排序,插入排序算法示例
2019/03/02 Javascript
js实现经典贪吃蛇小游戏
2020/03/19 Javascript
ES6函数和数组用法实例分析
2020/05/23 Javascript
Python转码问题的解决方法
2008/10/07 Python
在Python的Django框架中调用方法和处理无效变量
2015/07/15 Python
详解python中字典的循环遍历的两种方式
2017/02/07 Python
Python字符编码与函数的基本使用方法
2017/09/30 Python
Python读取properties配置文件操作示例
2018/03/29 Python
python实现随机调用一个浏览器打开网页
2018/04/21 Python
详解Python 解压缩文件
2019/04/09 Python
Python3.9最新版下载与安装图文教程详解(Windows系统为例)
2020/11/28 Python
HTML5 CSS3实现一个精美VCD包装盒个性幻灯片案例
2014/06/16 HTML / CSS
英国度假别墅预订:Sykes Cottages
2017/06/12 全球购物
2014年元旦活动方案
2014/02/15 职场文书
法人授权委托书
2014/04/03 职场文书
英语专业求职信
2014/07/08 职场文书
报到证办理个人委托书
2014/10/06 职场文书
公务员考察材料
2014/12/23 职场文书
内勤岗位职责范本
2015/04/13 职场文书
25张裸眼3D图片,带你重温童年的记忆,感受3D的魅力
2022/02/06 杂记
微信小程序实现轮播图指示器
2022/06/25 Javascript