使用jQuery非同步載入 JavaScript指令碼解決方案

JavaScript 載入器在 Web 開發中是非常強大和有用的工具。目前流行的幾個載入器，像 curljs、LABjs 和 RequireJS 使用都很廣泛。他們功能強大的，但有些情況下可以有更簡單的方案。

如果你正在使用 jQuery，有一個內建的方法可以用來載入指令碼。如果你想消極式載入外掛程式或任何其他類型的指令碼，都可以使用這種方法。下面給大家介紹如何使用它。

實現方法

jQuery 內建有 getScript 方法來載入一個指令碼，處理返回的結果可以有幾種方法來實現。最基本的用法 jQuery.getScript 看起來像這樣：
複製代碼 代碼如下:
jQuery.getScript("/path/to/myscript.js", function(data, status, jqxhr) {

/*
　　在指令碼已載入並執行後，就可以做一些處理了
*/

});

getScript 方法返回一個 jqXHR 對象，因此可以這樣使用：
複製代碼 代碼如下:
jQuery.getScript("/path/to/myscript.js")
.done(function() {
/* 執行成功後的處理 */
})
.fail(function() {
/* 執行失敗後的處理 */
});

使用 jQuery.getScript 的最常見情境是消極式載入一個外掛程式，並在載入後調用它：
複製代碼 代碼如下:
jQuery.getScript("jquery.cookie.js")
.done(function() {
jQuery.cookie("cookie_name", "value", { expires: 7 });
});

如果你需要做更進階的事情，如載入多個指令碼和不同類型的檔案（文字檔，映像，CSS 檔案等），我建議你切換到一個功能更強大的 JavaScript 載入器。如果只想消極式載入外掛程式，而不是簡單地在每個頁面載入的情況下，getScript 是完美的！

緩衝問題

需要注意的是，當使用 jQuery.getScript 的時候，在指令碼 URL 後面會自動被添加上時間戳記，讓指令碼不緩衝。因此你需要設定讓所有的請求都緩衝指令碼：
複製代碼 代碼如下:
jQuery.ajaxSetup({
cache: true
});

如果您不希望覆蓋所有的緩衝與你的 AJAX 請求，最好使用 jQuery.ajax 方法並把 dataType 設定為 script，例如這樣：
複製代碼 代碼如下:
jQuery.ajax({
url: "jquery.cookie.js",
dataType: "script",
cache: true
}).done(function() {
jQuery.cookie("cookie_name", "value", { expires: 7 });
});

在載入指令碼的時候需要特別注意緩衝問題！