添加stylesheet使用jQuery

我已經讀了它，它似乎是最好的方法添加使用jQuery樣式表如下：不同主題之間添加stylesheet使用jQuery

$('head').append('<link rel="stylesheet" type="text/css" href="../css/mystyle.css">');

現在我想要做什麼，是開關使用這種方法：

<script type="text/javascript"> 
     $(document).ready(function() { 
      if($('body').hasClass('pink')) 
      { 
       $('head').append('<link rel="stylesheet" type="text/css" href="../css/mystylePink.css">'); 
      } 
      else 
      { 
       $('head').append('<link rel="stylesheet" type="text/css" href="../css/mystyle.css">'); 
      } 
     }); 
</script>

我的問題：除了形式的用戶沒有啓動Javascript，有什麼併發症/問題加載這樣的樣式表時存在？ IE瀏覽器？移動瀏覽器？因爲我實際上想在移動網站上使用它...

來源

2013-03-25 David Van Staden

這裏的主要問題是樣式表加載時無格式內容的閃爍，而不是IE或移動瀏覽器。

我建議你使用CSS預處理器（SASS，LESS），只用一個樣式表和普通樣式，然後用下面的.pink類覆蓋。

.myClass{ 
    color: white; 
    background: black; 
} 

.pink .myClass{ 
    color: pink; 
    background: grey; 
}

來源

2013-03-25 13:15:42 ahren

是的我同意，謝謝。問題是我有很多不使用類並使用元素定位的樣式：例如#wrapper ul li a {}，我不想將樣式添加到現有的html元素中。所以我可以做的是加載一個樣式表開始使用，然後在文檔準備好後用另一個替換它....然後當然是用window.onload預加載 - 在加載所有內容時顯示加載的gif – 2013-03-25 13:24:34

SASS/LESS將負責特定元素定位。 – ahren 2013-03-25 13:25:30

好酷，我看到謝謝...除IE以外兼容性怎麼樣？使用我的方法可靠和安全嗎？ – 2013-03-25 13:26:30

此方法在IE8及以下版本中無法正常工作。

您必須使用另一種方法，如IEss document.createStyleSheet（）方法。

請參閱此討論瞭解更多信息：Can I load external stylesheets on request?

來源

2013-03-25 13:16:20 Julian

感謝您的洞察力 – 2013-03-25 13:20:30

添加stylesheet使用jQuery

回答

相關問題