本文主要介绍js实现延迟加载的几种方法。js的延迟加载有助于提高页面的加载速度,主要介绍三种方法。有兴趣的可以看看。
js的延迟加载有助于提高页面的加载速度。以下是几种延迟加载的方法:
1.使用setTimeout延迟方法的加载时间
延迟加载js代码,以便有更多时间加载网页。
脚本类型='文本/javascript '
函数A(){
$.post('/lord/login ',{name:username,pwd:password},function(){
alert(' Hello ');
});
}
$(function (){
setTimeout('A()',1000);//延迟1秒
})
/脚本
2.让js最后加载
比如在引入外部js脚本文件的时候,如果放在html的头部,js脚本会在页面加载之前加载到页面中,而放在正文的时候,JavaScript代码会按照页面的加载顺序自上而下运行~ ~这样我们就可以把从js外部导入的文件放在页面的底部,这样js就可以最终引入,从而加快页面加载的速度。
3.上面的方法2也会偶尔让你收到Google的页面速度测试工具发出的“延迟加载javascript”警告。因此,这里的解决方案将是谷歌帮助页面推荐的解决方案。
//这些代码应该放在/body标记之前(靠近HTML文件的底部)
脚本类型='文本/javascript '
函数downloadJSAtOnload() {
var element=document . createelement(' script ');
element . src=' defer . js ';
document.body.appendChild(元素);
}
if (window.addEventListener)
window.addEventListener('load ',downloadJSAtOnload,false);
else if (window.attachEvent)
window.attachEvent('onload ',downloadJSAtOnload);
else window . onload=downloadJSAtOnload;
/脚本
这段代码意味着在加载外部文件“defer.js”之前,要等到整个文档都加载完毕。
使用此代码的步骤:
1).复制上面的代码。
2).将代码粘贴到HTML的标签前面(靠近HTML文件的底部)
3).将“defer.js”修改为外部js文件名
4).请确保您的文件路径正确。例如,如果只输入“defender.js”,那么“defender.js”文件必须与HTML文件在同一个文件夹中。
注意:在加载文档之前,这段代码不会加载指定的外部js文件。因此,您不应该将页面正常加载所依赖的javascript代码放在这里。相反,JavaScript代码应该分为两组。一组是因为页面的需要而立即加载的javascript代码,另一组是页面加载后运行的javascript代码(比如添加点击事件或者其他事情)。这些JavaScript代码需要等到页面加载后才能执行,它们应该放在一个外部文件中,然后导入。
这就是本文的全部内容。希望对大家的学习有帮助,支持我们。
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。