如何動態載入外部樣式表

在實際引用中可能需要動態的載入外部樣式表，下面介紹一下如何實現此效果。

[JavaScript] 純文字檢視 複製程式碼
function addSheet(path){ 
  var cssLink=document.createElement("link") 
  cssLink.rel="stylesheet"; 
  cssLink.type="text/css"; 
  cssLink.href=path; 
  cssLink.media="screen"; 
  var headobj=document.getElementsByTagName('head')[0]; 
  headobj.appendChild(fileref); 
}

以上是一個函式，可以在需要的時候呼叫就可以了。

程式碼註釋:

1.function addSheet(path){}，建立一個函式，此函式會傳遞一個引數，為外部樣式表的路徑。

2.var cssLink=document.createElement("link"),通過createElement()函式建立一個link元素。

3.cssLink.rel="stylesheet"，設定link的rel屬性值。

4.cssLink.type="text/css"，設定link的type屬性值。

5.cssLink.href=path，設定link的href屬性值。

6.cssLink.media="screen"，設定link的href屬性值。

7.var headobj=document.getElementsByTagName('head')[0]，獲取head物件集合的第一個head元素。

8.headobj.appendChild(fileref)，將link元素新增到head中。