JavaScript 載入器在 Web 開發中是非常強大且有用的工具。目前流行的幾個載入器,像是 curljs、LABjs 和 RequireJS 使用都很廣泛。他們功能強大的,但有些情況下可以有更簡單的方案。
如果你正在使用 jQuery,有一個內建的方法可以用來載入腳本。如果你想延遲載入外掛程式或任何其他類型的腳本,都可以使用這種方法。下面跟大家介紹如何使用它。
實作方法
jQuery 內建有 getScript 方法來載入一個腳本,處理傳回的結果可以有幾種方法來實作。最基本的用法jQuery.getScript 看起來像這樣:
程式碼如下:
/*
在腳本已載入並執行後,就可以做一些處理了
*/
});
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 後面會自動被加入時間戳,讓腳本不快取。因此你需要設定讓所有的請求都快取腳本:
複製程式碼
程式碼如下:
如果您不希望覆蓋所有的快取與你的AJAX 請求,最好使用jQuery.ajax 方法並把dataType設定為script,例如這樣:
複製程式碼
程式碼如下:
jQuery.ajax({jQuery. url: "jquery.cookie.js", dataType: "script", cache: true }).done(function() { jQuery.cookie("cookie_name" , "value", { expires: 7 }); }); 在載入腳本的時候需要特別注意快取問題!