可以在頁面加載的其餘部分加載JavaScript代碼嗎？

我有一段網頁從外部源加載JavaScript文件，然後啓動Ajax查詢。可以在頁面加載的其餘部分加載JavaScript代碼嗎？

當我加載頁面時，我看到瀏覽器說「等待example.com」很多，所以我認爲依賴這個外部JavaScript會減慢我的初始頁面加載速度。

有沒有一種方法可以異步加載這個外部JavaScript，因此它不會減慢我的頁面其餘部分的加載速度？

來源

2010-07-05 leora

'defer'沒有得到廣泛的支持。我刪除了我的答案。 – Unicron 2010-07-05 16:27:09

將JS放置在底部，正好在關閉body標記的上方是一種很好的做法。另外，使用加載事件window.onload或$(document).ready()在加載頁面後觸發JavaScript。

只要加載JavaScript文件是自己異步或按需提供的，您可以從另一個JavaScript函數或事件注入它。但是，你真的是在做同樣的事情，把它放在底部。

查看YSlow Guidelines進行前端優化。

來源

2010-07-05 16:25:57

我真的不喜歡將腳本放在頁面底部的建議。我個人在'HEAD'中放置了腳本（除了那些調用'document.write（）'的函數外，我幾乎從不使用它們），因爲它看起來更加正確，並且看起來更清晰，與所有'link'標籤分組在一起。此外，當您在頁面加載後立即觸發AJAX請求時，「等待」狀態將顯示出來。所以對用戶來說，它不應該有所作爲。 – 2010-07-05 17:09:00

@Lèse，這是一個經過驗證的行業支持優化。這不是個人建議或要求。但就語義而言，HTML規範中沒有任何內容針對'head'標籤外的'script'標籤。因此，實際上只有一個組織原因。那麼'body'的'head'和bottom有什麼區別呢？儘管對狀態消息表示同意。 – 2010-07-05 17:55:00

據我所知，這是雅虎提出的一項建議，許多大型網站都使用它，或者至少將其用於某些外部腳本（如分析），而不僅僅是將它扔到那裏。我只是不喜歡這種做法。語義不一定與語言規範相關聯。使用表格進行佈局是完全合法的，但這並不能使其在語義上正確。關鍵是，當你鏈接一個JS庫時，它是元信息不是文檔的一部分（或者至少是文檔體）。這與'link'標籤放在'head'中的原因是一樣的。 – 2010-07-05 18:04:28

你可以看到我的答案在這裏：Dynamic (2 levels) Javascript/CSS Loading

並抓住從here腳本（查看源）。在底部使用它，你的腳本不會阻塞其他資源（如果你有多個資源，它們將被並行下載到跨瀏覽器中）。

來源

2010-07-05 16:23:52 galambalazs

你可以使用jQuery的.getScript()方法，它只是一個AJAX調用的包裝。

http://api.jquery.com/jquery.getscript/

這使得異步請求，併爲您提供腳本加載之後運行的回調。

來源

2010-07-05 16:25:47 user113716

有趣......這可能也適用於JSON/P。 – 2010-07-05 17:10:22

我寫了一個庫回調異步加載JavaScript文件加載時：

https://github.com/ssoroka/sigma

Sigma.async_script_load('http://example.com/underscore/underscore-min.js', '_', function() { 
    _([1,2,3,2,3,1]).uniq(); 
});

來源

2010-12-14 01:22:52

可以在頁面加載的其餘部分加載JavaScript代碼嗎？

回答

相關問題