js延遲加載的方式有哪些？

一般有以下幾種方式：

網(wǎng)站建設哪家好，找創(chuàng)新互聯(lián)！專注于網(wǎng)頁設計、網(wǎng)站建設、微信開發(fā)、重慶小程序開發(fā)公司、集團企業(yè)網(wǎng)站建設等服務項目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了津南免費建站歡迎大家使用！

defer 屬性

HTML 4.01 為 script標簽定義了 defer屬性。

用途：表明腳本在執(zhí)行時不會影響頁面的構造。也就是說，腳本會被延遲到整個頁面都解析完畢之后再執(zhí)行。

在script 元素中設置 defer 屬性，等于告訴瀏覽器立即下載，但延遲執(zhí)行。

!DOCTYPE?htmlhtmlheadscript?src="test1.js"?defer="defer"/scriptscript?src="test2.js"?defer="defer"/script/headbody?!--?這里放內(nèi)容?--?/body/html? ?

說明：雖然script 元素放在了head元素中，但包含的腳本將延遲瀏覽器遇到/html標簽后再執(zhí)行。

HTML5規(guī)范要求腳本按照它們出現(xiàn)的先后順序執(zhí)行。在現(xiàn)實當中，延遲腳本并不一定會按照順序執(zhí)行。

defer屬性只適用于外部腳本文件。支持 HTML5 的實現(xiàn)會忽略嵌入腳本設置的 defer屬性。

2. async 屬性

HTML5 為 script標簽定義了 async屬性。與defer屬性類似，都用于改變處理腳本的行為。同樣，只適用于外部腳本文件。

目的：不讓頁面等待腳本下載和執(zhí)行，從而異步加載頁面其他內(nèi)容。

異步腳本一定會在頁面 load 事件前執(zhí)行。

不能保證腳本會按順序執(zhí)行。

!DOCTYPE?htmlhtmlhead?script?src="test1.js"?async/scriptscript?src="test2.js"?async/script?/headbody?!--?這里放內(nèi)容?--?/body/html? ?

4.使用jQuery的getScript()方法

$.getScript("outer.js",function(){//回調(diào)函數(shù)，成功獲取文件后執(zhí)行的函數(shù)??

console.log("腳本加載完成")??

});

5.使用setTimeout延遲方法

6.讓JS最后加載

把js外部引入的文件放到頁面底部，來讓js最后引入，從而加快頁面加載速度

by三人行慕課

如何在Javascript中將一個函數(shù)延遲一秒后執(zhí)行？

javascript提供了setTimeout() 方法用于在指定的毫秒數(shù)后調(diào)用函數(shù)或計算表達式，因此延遲1秒后執(zhí)行一個函數(shù)可以如下代碼實現(xiàn)：

setTimeout("fun()",1000);???//?fun()是自定義函數(shù)

下面實例演示：打開頁面后倒計時3秒，然后彈出對話框

1、HTML結構

div?id="test"3/div

2、javascript代碼

function?fun(n){

if(n0){

n--;

document.getElementById("test").innerHTML?=?n;

setTimeout("fun("+n+")",1000)

}

else

alert("時間到！！");

}

window.onload?=?function(){

setTimeout("fun(3)",1000)

}

3、效果演示

如何用javascript設置延時執(zhí)行

二、JavaScript 的計時事件的函數(shù)

setTimeout() - 在指定時間后執(zhí)行代碼

clearTimeout() - 取消 setTimeout()注意:setTimeout() 和 clearTimeout() 都是HTML DOM 的 Window 對象的函數(shù)。

三、setTimeout詳解

var t=setTimeout("javascript 語句",時間參數(shù))

注：時間參數(shù)單位為毫秒

示例：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單獨設置為一個函數(shù)。如：

function delayRun(code,time) {

var t=setTimeout(code,time);}這樣，在需要讓某段代碼延時執(zhí)行的時候，只需在這段代碼前加入這個函數(shù)就可以了。如：

onmouseover=delayRun("setTab(0,0)",500)

其中setTab是一個自定義的函數(shù)。如果以后不想讓setTab延時執(zhí)行，則去掉語句中的delayRun相關的代碼即可，改為：onmouseover=setTab(0,0) 就可以了。

這種寫法避免每一個需要延時的地方都寫一段setTimeout的代碼，只需要直接調(diào)用就可以了，很方便。也節(jié)省了代碼的量。

JS中如何解決for循環(huán)中的延遲執(zhí)行問題

我們先來看一個例子

在JS方法里面設置一個for循環(huán)，輸出每次循環(huán)的值，如下圖

我們可以根據(jù)閉包的知識來更改一下for循環(huán)中的邏輯，利用閉包將i的值傳遞給a

這次在運行程序我們就可以看到輸出內(nèi)容是0開始輸出了

結果如下圖

JS中如果for循環(huán)中有異步方法，就需要用閉包的方式保留當前循環(huán)變量值

js延時5秒用find寫法

js延時5秒用find寫法setTimeout(function(){ getSignature() },5000);

在前端開發(fā)過程中,如果使用傳統(tǒng)的純js,有時會有延時執(zhí)行一個方法的需求.

使用js實現(xiàn)幾秒以后倒計時跳轉(zhuǎn)，這個在某些特殊情況下還是比較實用的。

Js延遲加載的方式有哪些？defer和async的區(qū)別是什么？

J s延遲加載的方式有哪些？

給javascript標簽添加 defer和async屬性。

defer和async的區(qū)別是什么？

1、defer和async都是使script異步加載的意思，當都沒有設置這個屬性的時候，html的加載會被阻塞等著script加載完成和執(zhí)行完成后再渲染頁面。

2、當設置了async時，異步加載，一旦加載完成則阻塞html渲染，進行執(zhí)行，而且如果有多個script標簽則誰先加載完，誰先執(zhí)行。

3、當設置了defer時，異步加載，不會阻塞html，待html渲染完畢后再進行script執(zhí)行。

注意：ie只支持defer

名稱欄目：javascript延遲,js延遲執(zhí)行
轉(zhuǎn)載來源：http://chinadenli.net/article24/dseegce.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供定制網(wǎng)站、網(wǎng)站改版、做網(wǎng)站、、用戶體驗、手機網(wǎng)站建設

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)