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

JavaScript012

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

本文介绍了如何延迟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.innerHTMLAD_L4EVER.innerHTML=”"</script>

3、让JS最后加载方案二

这个牵涉到网页的加载顺序问题,例如引入外部js脚本文件时,如果放入html的head中,则页面加载前该js脚本就会被加载入页面,而放入body中,则会按照页面从上倒下的加载顺序来运行javascript的代码~~~

所以我们可以把js外部引入的文件放到页面底部,来让js最后引入,从而加快页面加载速度。

使用JavaScript可以实现代码的延时执行,也就是说当一个函数被调用时不立即执行某些代码,而是等一段指定的时间后再执行,这就叫做计时事件。二、JavaScript 的计时事件的函数setTimeout() - 在指定时间后执行代码clearTimeout() - 取消 setTimeout()注意:setTimeout() 和 clearTimeout() 都是HTML DOM 的 Window 对象的函数。三、setTimeout详解var t=setTimeout("javascript 语句",时间参数)注:时间参数单位为毫秒示例:var t=setTimeout("alert('3 seconds!')",3000)如果js语句带变量,则必须用+号将变量连接起来,如:var t=setTimeout("document.getElementById("+menuid+").style.display='none'",3000)四、clearTimeout详解语法:clearTimeout(setTimeout的变量名)示例:clearTimeout(t) //其中t为前面设置的setTimeout的变量使用clearTimeout可以随时停止计时。五、应用技巧建议将setTimeout单独设置为一个函数。如:function delayRun(code,time) {var t=setTimeout(code,time)}这样,在需要让某段代码延时执行的时候,只需在这段代码前加入这个函数就可以了。如:onmouseover=delayRun("setTab(0,0)",500)其中setTab是一个自定义的函数。如果以后不想让setTab延时执行,则去掉语句中的delayRun相关的代码即可,改为:onmouseover=setTab(0,0) 就可以了。这种写法避免每一个需要延时的地方都写一段setTimeout的代码,只需要直接调用就可以了,很方便。也节省了代码的量。

js延时5秒用find写法setTimeout(function(){ getSignature() },5000)

在前端开发过程中,如果使用传统的纯js,有时会有延时执行一个方法的需求.

使用js实现几秒以后倒计时跳转,这个在某些特殊情况下还是比较实用的。