以正確的方式加載JS文件。如何？

我有幾個文件我在頭以正確的方式加載JS文件。如何？

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js"></script> 
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js"></script> 
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script> 
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

打電話和我所有的JS後什麼都依賴於這個庫，但谷歌的網頁速度抱怨說，這些腳本是在頁面加載阻滯劑文件。所以我試圖把所有內容都放在body關閉之前，但是在這種情況下，我將所有的腳本都破壞了，因爲它們依賴於jquery。

我試圖使用defer，但像這樣的腳註相同的問題。我如何加載異步JavaScript庫來打破這個漏洞？

來源

2016-06-07 fefe

必須有其他錯誤，jQuery不會中斷 – towc

請問您可以共享控制檯日誌嗎？ –

一般的解決方案是使用像RequireJS這樣的異步模塊加載。這裏有一個jQuery集成案例：http://requirejs.org/docs/jquery.html

考慮到「但在這種情況下，我會讓所有腳本因爲依賴於jquery而被破壞。」你可以添加檢查你的JS代碼，如：

$(document).ready(function(){ 
    //your jQuery-based code 
}) 


//if jQuery loading failed 
if(!window.jQuery){ 

}

來源

2016-06-07 12:39:49 shershen

包含很多腳本我只想優化頁面加載而不是重構孔代碼 – fefe

我列出的方式 - 重構與AMD或與'''！window.jQuery'''快速補丁。 – shershen

好的，謝謝我會試用requirejs – fefe

你可能想看看來自同一主機的文件數量。看看this。

來源

2016-06-07 12:42:43 EinarI

你喜歡什麼實現是AMD（異步模塊定義）

異步模塊定義（AMD）是一個JavaScript規範，定義一個API用於定義代碼模塊和它們的依賴，並如果需要，可以異步加載它們。 瞭解更多：https://en.wikipedia.org/wiki/Asynchronous_module_definition

有對那一堆框架：

RequireJS - http://requirejs.org
Dojo Toolkit的 - https://dojotoolkit.org

也可以加載JS文件手動使用此方法（不推薦）： https://stackoverflow.com/a/7719185/1502230

來源

2016-06-07 12:47:17

以正確的方式加載JS文件。如何？

回答

相關問題