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 相关文章推荐
JavaScript+CSS控制打印格式示例介绍
Jan 07 Javascript
js 通过html()及text()方法获取并设置p标签的显示值
May 14 Javascript
JavaScript实现数据类型的相互转换
Mar 06 Javascript
jQuery扩展+xml实现表单验证功能的方法
Dec 25 Javascript
jQuery、zepto、js常用小技巧
Feb 12 Javascript
js 单引号替换成双引号,双引号替换成单引号的实现方法
Feb 16 Javascript
如何重置vue打印变量的显示方式
Dec 06 Javascript
快速解决vue在ios端下点击响应延时的问题
Aug 27 Javascript
swiper在vue项目中loop循环轮播失效的解决方法
Sep 15 Javascript
JavaScript实现动态添加、移除元素或属性的方法分析
Jan 03 Javascript
React+Antd+Redux实现待办事件的方法
Mar 14 Javascript
react quill中图片上传由默认转成base64改成上传到服务器的方法
Oct 30 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
星际争霸, 教主第一视角, ZvT经典龙蛇演义
2020/03/02 星际争霸
php除数取整示例
2014/04/24 PHP
php实现每天自动变换随机问候语的方法
2015/05/12 PHP
php判断linux下程序问题实例
2015/07/09 PHP
php中文语义分析实现方法示例
2019/09/28 PHP
php 实现简单的登录功能示例【基于thinkPHP框架】
2019/12/02 PHP
phpmyadmin在宝塔面板里进不去的解决方案
2020/07/06 PHP
在一个form用一个SUBMIT(或button)分别提交到两个处理表单页面的代码
2007/02/15 Javascript
javascript 最常用的10个自定义函数[推荐]
2009/12/26 Javascript
Jquery 扩展方法
2010/05/06 Javascript
JQuery中对服务器控件 DropdownList, RadioButtonList, CheckboxList的操作总结
2011/06/28 Javascript
打豆豆小游戏 用javascript编写的[打豆豆]小游戏
2013/01/08 Javascript
JavaScript通过setTimeout实时显示当前时间的方法
2015/04/16 Javascript
JavaScript中三种常见的排序方法
2017/02/24 Javascript
解决Vue页面固定滚动位置的处理办法
2017/07/13 Javascript
ES6新增的math,Number方法
2017/08/06 Javascript
Vue单页应用引用单独的样式文件的两种方式
2018/03/30 Javascript
利用Node.js如何实现文件循环覆写
2019/04/05 Javascript
基于vue-cli3+typescript的tsx开发模板搭建过程分享
2020/02/28 Javascript
解决vue动态路由异步加载import组件,加载不到module的问题
2020/07/26 Javascript
详解Vue中的自定义指令
2020/12/07 Vue.js
python简单分割文件的方法
2015/07/30 Python
Python中使用bidict模块双向字典结构的奇技淫巧
2016/07/12 Python
python获取程序执行文件路径的方法(推荐)
2018/04/26 Python
Python使用post及get方式提交数据的实例
2019/01/24 Python
丝芙兰法国官网:SEPHORA法国
2016/09/01 全球购物
宝信软件JAVA工程师面试经历
2012/08/19 面试题
会计学个人自荐信模板
2013/12/13 职场文书
乱丢垃圾袋检讨书
2014/10/08 职场文书
工厂门卫岗位职责
2015/04/13 职场文书
世界文化遗产导游词
2019/08/07 职场文书
golang中的空接口使用详解
2021/03/30 Python
python 统计代码耗时的几种方法分享
2021/04/02 Python
用Python远程登陆服务器的步骤
2021/04/16 Python
PostgreSQL出现死锁该如何解决
2022/05/30 PostgreSQL
MySQL控制流函数(-if ,elseif,else,case...when)
2022/07/07 MySQL