DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> 使用jQuery動態加載js腳本文件的方法
使用jQuery動態加載js腳本文件的方法
編輯:JQuery特效代碼     

它們很強大,但有時候也會得不償失。如果你使用的是jQuery,它裡面有一個內置的方法可以用來加載單個js文件。當你需要延遲加載一些js插件或其它類型的文件時,可以使用這個方法。下面就介紹一下如何使用它!

一、jQuery getScript()方法加載JavaScript

jQuery內置了一個方法可以加載單一的js文件;當加載完成後你可以在回調函數裡執行後續操作。最基本的使用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的地方是延遲加載一個js插件,而且在加載完成時執行它:
. 代碼如下:
jQuery.getScript("jquery.cookie.js")
 .done(function() {
  jQuery.cookie("cookie_name", "value", { expires: 7 });
});

二、緩存問題

有一個非常重要的問題,使用jQuery.getScript時,你需要用一個時間戳字符串跟在需要加載的js地址後面,防止它被緩存。但是,如果你希望這個腳本被緩存,你需要設置全局緩存變量,像下面這樣:

. 代碼如下:
jQuery.ajaxSetup({
  cache: true
});

. 代碼如下:
jQuery.ajax({
      url: "jquery.cookie.js",
      dataType: "script",
      cache: true
}).done(function() {
  jQuery.cookie("cookie_name", "value", { expires: 7 });
});

在加載腳本時一定要小心緩存問題!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved