讓JavaScript和其它資源並發下載的方法_javascript技巧

在IE6/7裡JavaScript會從兩個方面阻礙頁面呈現：
script標籤下面的網頁資源在script載入完之前會停止要求、下載。
script標籤下面的html元素在script載入完之前就會停止渲染。

在ie6/7 firefox2/3 Safari3 Chrome1 和 opera下 script標籤會阻礙下載：

雖然在ie8，safari4，chrome2下script可以並發，但依然阻礙了其他資源的下載：

有6種方法可以讓script與其他資源並行下載：

1.XHR eval — 透過XHR(XMLHttpRequest 物件)下載script，然後用eval方法執行XHR的responseText
2.XHR Injection — 透過XHR下載script，然後建立一個script標籤並把它插入文件中(body或head標籤內),接著把script標籤的text屬性設定為XHR的responseText的值
3.XHR in Iframe — 把script標籤放到一個iframe裡，透過iframe下載它
4.Script DOM Element — 建立script標籤並把它的src屬性指向你的腳本位址
5.Script Defer — 新增script標籤的defer屬性，這個只在ie中有效，但firefox3.1也支援這個屬性了
6.使用document.write方法在頁中寫入

可以透過Cuzillion查 看各個方法的使用範例。

如果有一些內聯腳本需要在外部腳本執行後才能執行，那就需要同步(synchronize)他們了。稱作”coupling”，Coupling Asynchronous Scripts 這篇文章介紹了一些目前可以實現“coupling”的方法。

headjs，能使JS並發下載（但是順序執行）：http://headjs.com/

複製程式碼 程式碼如下:

head.js("/path/to/jquery.js", "/google/analytics.js", "/js/site.js", function() { 
  // all done 
}); 
  
// the most simple case. load and execute single script without blocking. 
head.js("/path/to/file.js"); 
  
// load a script and execute a function after it has been loaded 
head.js("/path/to/file.js", function() { 
  
}); 
  
// load files in parallel but execute them in sequence 
head.js("file1.js", "file2.js", ... "fileN.js"); 
  
// execute function after all scripts have been loaded 
head.js("file1.js", "file2.js", function() { 
  
}); 
  
// files are loaded in parallel and executed in order they arrive 
head.js("file1.js"); 
head.js("file2.js"); 
head.js("file3.js"); 
  
// the previous can also be written as 
head.js("file1.js").js("file1.js").js("file3.js");