js延时加载的方法
js的延迟加载有助与提高页面的加载速度,以下是延迟加载的几种方法:
1.使用setTimeout延迟方法的加载时间
延迟加载js代码,给网页加载留出更多时间
<script type="text/javascript" >
function A(){
$.post("/lord/login",{name:username,pwd:password},function(){
alert("Hello");
});
}
$(function (){
setTimeout('A()', 1000); //延迟1秒
})
</script>
- 2.让js最后加载
例如引入外部js脚本文件时,如果放入html的head中,则页面加载前该js脚本就会被加载入页面,而放入body中,则会按照页面从上倒下的加载顺序来运行JavaScript的代码~~~ 所以我们可以把js外部引入的文件放到页面底部,来让js最后引入,从而加快页面加载速度
- 3.上述方法2也会偶尔让你收到Google页面速度测试工具的“延迟加载javascript”警告。所以这里的解决方案将是来自Google帮助页面的推荐方案。
//这些代码应被放置在</body>标签前(接近HTML文件底部)
<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>
这段代码意思是等到整个文档加载完后,再加载外部文件“defer.js”。
使用此段代码的步骤:
1).复制上面代码
2).粘贴代码到HTML的标签前 (靠近HTML文件底部)
3).修改“defer.js”为你的外部JS文件名
4).确保你文件路径是正确的。例如:如果你仅输入“defer.js”,那么“defer.js”文件一定与HTML文件在同一文件夹下。
注意:这段代码直到文档加载完才会加载指定的外部js文件。因此,不应该把那些页面正常加载需要依赖的javascript代码放在这里。而应该将JavaScript代码分成两组。一组是因页面需要而立即加载的javascript代码,另外一组是在页面加载后进行操作的javascript代码(例如添加click事件或其他东西)。这些需等到页面加载后再执行的JavaScript代码,应放在一个外部文件,然后再引进来。
js延时加载的方法的更多相关文章
- JS 异步加载的方法
(1) defer,只支持IE : <script type="text/javascript" defer="defer"> </scrip ...
- 自己写的保证js顺序加载的方法
var arr =["test1.js","test2.js","test3.js"] loadScripts:function(arr){ ...
- js jquery 页面加载初始化方法
js jquery 页面加载初始化方法 一.js页面加载初始化方法 // 1.在body里面写初始化方法. <body onload='init()'> </body> < ...
- iOS 延时加载
这里列举了四种线程延时加载的方法, 1.performSelector方法 此方法必须在主线程中执行,并不是阻塞当前的线程 [self performSelector:@selector(delayM ...
- 服务器文档下载zip格式 SQL Server SQL分页查询 C#过滤html标签 EF 延时加载与死锁 在JS方法中返回多个值的三种方法(转载) IEnumerable,ICollection,IList接口问题 不吹不擂,你想要的Python面试都在这里了【315+道题】 基于mvc三层架构和ajax技术实现最简单的文件上传 事件管理
服务器文档下载zip格式 刚好这次项目中遇到了这个东西,就来弄一下,挺简单的,但是前台调用的时候弄错了,浪费了大半天的时间,本人也是菜鸟一枚.开始吧.(MVC的) @using Rattan.Co ...
- 一段实现页面上的图片延时加载的js
大家如果使用firebug去查看的话就会发现,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对于比较 ...
- js实现网页图片延时加载的原理和代码 提高网站打开速度
有时我们看到一些大型网站,页面如果有很多图片的时候,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对 ...
- 图片延时加载jquery.inview.js用法详解
我们在网站上总能见到这样的效果,若是有图片,图片都是先用loading加载一小段时间,然后紧接着出来要显示的图片,即效果如下: v2_loading.gif,几秒钟时间过渡到v2_pic_01_s.j ...
- js动态加载css文件和js文件的方法
今天研究了下js动态加载js文件和css文件的方法. 网上发现一个动态加载的方法.摘抄下来,方便自己以后使用 [code lang="html"] <html xmlns=& ...
随机推荐
- 省市县三级联动js代码
省市县三级联动菜单,JS全国省市县(区)联动代码,一般可以用于用户注册或分类信息二手交易网站,需要的朋友直接复制代码就可以用了,不过有朋友反馈说缺少某些城市,具体缺少哪个尚不知,请想用的朋友自己补全吧 ...
- tesnorflow conv deconv,padding
1.padding test input = tf.placeholder(tf.float32, shape=(1,2, 2,1)) simpleconv=slim.conv2d(input,1,[ ...
- 图片存储系统TFS
1 TFS和GFS比较 1.1 GFS的应用场景 第一,百万级别的文件,并且是大文件,文件都是100MB以上,1G级别的文件很常见. 第二,集群是建立在商业计算机之上,并不可靠,监控各个节点的状态,当 ...
- 怎样处理Gradle中的这个文件下载慢的问题的
如图:在build.gradle中的dependencies中加上要依赖的包后,就点击sync gradle.然后就开始了下载.在此过程中我是FQ了的(在此同时我是可以用chrome进入https:/ ...
- git log 常用选项
git log 常用选项 -p 按补丁格式显示每个更新之间的差异. jiqing@Ubuntu:/home/wwwroot/default/5hao/sheep$ git log -p commit ...
- easyui 生成tas方式
1.采用<a>标签形式 <div id="tabs" style="width:100%;"> <ul> <li id ...
- sql2000数据库置疑造成的原因以及如何解决置疑
造成数据库置疑一般有以下几点: 1)电脑非法关机或者意外停电: 2)磁盘有坏道或者损坏: 3)数据库感染病毒,日志文件损坏: 4)非正常情况下移动数据库文件 5)系统,硬盘,经常强制性关机(如断电)类 ...
- bzoj 1611: [Usaco2008 Feb]Meteor Shower流星雨【BFS】
t记录每个格子最早被砸的时间,bfs(x,y,t)表示当前状态为(x,y)格子,时间为t.因为bfs,所以先搜到的t一定小于后搜到的,所以一个格子搜一次就行 #include<iostream& ...
- 赋予option元素点击事件后,点击select时却触发了option事件。如何解决?
将select的优先级提到option之前就可以了. 方法:为select元素添加position:relative: <select class="adt" name=&q ...
- Akka源码分析-Akka-Streams-Materializer(1)
本博客逐步分析Akka Streams的源码,当然必须循序渐进,且估计会分很多篇,毕竟Akka Streams还是比较复杂的. implicit val system = ActorSystem(&q ...