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 相关文章推荐
Web版彷 Visual Studio 2003 颜色选择器
Jan 09 Javascript
javascript下4个跨浏览器必备的函数
Mar 07 Javascript
Javascript中的isNaN函数使用说明
Nov 10 Javascript
jquery ajax 简单范例(界面+后台)
Nov 19 Javascript
Jquery修改页面标题title其它JS失效的解决方法
Oct 31 Javascript
JavaScript中的Function函数
Aug 27 Javascript
JS正则表达式比较常见用法
Jan 26 Javascript
浅谈jQuery before和insertBefore的区别
Dec 04 Javascript
微信小程序 template模板详解及实例
Feb 21 Javascript
vue使用中的内存泄漏【推荐】
Jul 10 Javascript
小程序获取周围IBeacon设备的方法
Oct 31 Javascript
vue路由传参三种基本方式详解
Dec 09 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
phpExcel中文帮助手册之常用功能指南
2014/08/18 PHP
javascript xml为数据源的下拉框控件
2009/07/07 Javascript
extJs 常用到的增,删,改,查操作代码
2009/12/28 Javascript
如何使Chrome控制台支持多行js模式——意外发现
2013/06/13 Javascript
jquery实现动态菜单的实例代码
2013/11/28 Javascript
jquery获取tagName再进行判断
2014/05/29 Javascript
JavaScript实现的石头剪刀布游戏源码分享
2014/08/22 Javascript
jQuery中append()方法用法实例
2015/01/08 Javascript
详细解读JavaScript的跨浏览器事件处理
2015/08/12 Javascript
在JavaScript中模拟类(class)及类的继承关系
2016/05/20 Javascript
jQuery插件EasyUI实现Layout框架页面中弹出窗体到最顶层效果(穿越iframe)
2016/08/05 Javascript
JavaScript学习笔记--常用的互动方法
2016/12/07 Javascript
BootstrapValidator超详细教程(推荐)
2016/12/07 Javascript
Angular.js自定义指令学习笔记实例
2017/02/24 Javascript
javascript 中的继承实例详解
2017/05/05 Javascript
ES6 Class中实现私有属性的一些方法总结
2019/07/08 Javascript
VUE渲染后端返回含有script标签的html字符串示例
2019/10/28 Javascript
详解用js代码触发dom事件的实现方案
2020/06/10 Javascript
[05:08]2014DOTA2国际邀请赛 Hao专访复仇的胜利很爽
2014/07/15 DOTA
python类继承用法实例分析
2014/10/10 Python
Python解析json之ValueError: Expecting property name enclosed in double quotes: line 1 column 2(char 1)
2017/07/06 Python
django模型层(model)进行建表、查询与删除的基础教程
2017/11/21 Python
基于Python获取城市近7天天气预报
2019/11/26 Python
Matlab中plot基本用法的具体使用
2020/07/17 Python
python3.7.3版本和django2.2.3版本是否可以兼容
2020/09/01 Python
Python collections.deque双边队列原理详解
2020/10/05 Python
布里斯班女装时尚品牌:Adrift
2017/12/28 全球购物
MIRTA官网:手工包,100%意大利制造
2020/02/11 全球购物
中海讯通笔试题
2015/09/15 面试题
文明礼仪伴我行演讲稿
2014/05/12 职场文书
高中生学习计划书
2014/09/15 职场文书
党员民主生活会对照检查材料思想汇报
2014/09/28 职场文书
2015年人民调解工作总结
2015/05/18 职场文书
《学会看病》教学反思
2016/02/17 职场文书
餐厅营销的秘密:为什么老顾客会流水?
2019/08/08 职场文书
励志语录:时光飞逝,请学会珍惜所有的人和事
2020/01/16 职场文书