Javascript切換皮膚樣式個案

    不久前做一個頁面切換皮膚的指令碼,遇到一個非常棘手的問題.有這樣三個樣式檔案 blue.css,black.css,default.css,而blue.css和black.css兩個檔案中的首行均有一行import url(default.css)的匯入語句,預設樣式為black.css,使用
<link rel=stylesheet type=text/css src="black.css" />
引入到頁面中,一開始比較簡單的寫上切換的代碼

document.styleSheets[0].href = "blue.css";

    這樣做的ie6下正常,在ie7/8beta1中會導致default.css定義的樣式丟失而只成功的應用了blue.css定義的樣式,在firefox中則根本不能執行.於是,參考了一些相容性的辦法後修改一下,為link標籤加上一個id命名為lkStyle,即
<link id="lkStyle" rel="stylesheet" type="text/css" href="black.css" />
修改的指令碼如下

var objStyle = document.getElementById("lkStyle");
objStyle.href ="";
objStyle.href = "blue.css";

就這三句代碼就能夠在firefox/ie6/ie7/ie8beta下相容運行,並且切換的時候不再丟失import匯入的樣式了.