使用javascript添加動態CSS？

我想添加動態CSS在我的HTML頁面，我做了一個功能使用導航功能，如果瀏覽器是Mozilla，然後功能將添加Mozilla的Css，否則它應該添加IE瀏覽器的CSS，但不知何故，我無法使它的工作。使用javascript添加動態CSS？

<head> 
<script type="text/javascript"> 
var cs; 
function nav() {   
var txt= navigator.appCodeName;    
if(txt=='mozilla') { 
cs= mozilla; 
} 
else{ 
cs= ie; 
}} 
</script>  
</head>  
<body onload="nav()"> 
<p id="cab"></p>  
</body> 
</html>

來源

2012-02-16 Jitender Chand

我將把你[this]（http://stackoverflow.com/a/9295354/1114171） – 2012-02-16 09:31:37

爲什麼要爲Safari，Chrome，Opera和其他不是Mozilla的其他東西添加IE特定的CSS？你爲什麼甚至擔心Mozilla？對它的支持在幾年前停止了，Mozilla基金會正在關注Firefox的瀏覽器工作。 – Quentin 2012-02-16 09:36:39

你爲什麼需要這個？瀏覽器像這樣嗅探非常非常過時並且通常是不必要的。大多數當前的瀏覽器都將CSS解釋爲差不多相同，所以如果你有偏差，那麼你很可能做錯了錯誤，或者如果沒有錯誤，通常會用一些簡單的工作來解決。 – RoToRa 2012-02-16 09:37:46

你真的應該使用conditional IE comments這個，而不是JavaScript。這是有很多原因，包括：當JavaScript被禁用或不可用

的CSS會工作。
您的JavaScript處理Mozilla，但Chrome和Opera等其他瀏覽器呢？
你往往需要單獨的CSS來「修復」IE的頁面佈局（特別是舊版本......），但其他主要瀏覽器都應該符合標準的CSS規則。

中的JavaScript你寫的有幾個問題：

的「Mozilla的字符串比較不會匹配，因爲瀏覽器有大寫M返回它：」Mozilla的。
鏈接標記中的'+ cs +'不會執行任何操作，因爲瀏覽器不會將其視爲javascript。

如果你真的想使用JavaScript，你可以從你的網頁的頭部分刪除鏈接標籤和嘗試的功能是這樣的（未測試）來做到這一點：

function setCss() { 
    var cssFileName; 

    if(navigator.appCodeName.toLowerCase() == 'mozilla') { 
     cssFileName = 'mozilla-style.css'; 
    } 
    else { 
     cssFileName = 'ie-style.css'; 
    } 

    // Create the element 
    var cssFileTag = document.createElement("link") 
    cssFileTag.setAttribute("rel", "stylesheet") 
    cssFileTag.setAttribute("type", "text/css") 
    cssFileTag.setAttribute("href", cssFileName) 

    // Add it to the head section 
    document.getElementsByTagName("head")[0].appendChild(cssFileTag) 
}

來源

2012-02-16 09:47:13 greg84

非常感謝格雷格這就是我想要的所有東西 – 2012-02-16 10:08:14

很高興幫助@JitenderChand - 隨時接受它作爲答案...;） – greg84 2012-02-16 10:13:19

這不是真正實現動態CSS的方法。相反，你應該使用條件註釋：

<!--[if IE 6]> 
Insert CSS Link for IE6 here 
<![endif]-->

見HERE

另見THIS答案

來源

2012-02-16 09:33:13 JackalopeZero

我想在bworser識別後添加css – 2012-02-16 09:40:06

+1更快！ – SpaceBison 2012-02-16 09:41:23

你們這些人太快了！ :) – greg84 2012-02-16 09:48:50

由於要求沒有腳本的情況下的替代方法，您可以檢測IE，或不 IE，通過使用條件註釋：

<!--[if IE]> 
According to the conditional comment this is IE<br /> 
<![endif]--> 
<!--[if IE 6]> 
According to the conditional comment this is IE 6<br /> 
<![endif]-->

所以你可以發現IE瀏覽器這種方式，或者在「Mozilla的電子表格負荷在此聲明

<!--[if !IE]> --> 
According to the conditional comment this is not IE 
<!-- <![endif]-->

您還可以在你的代碼中的一些語法問題，該行

<link href="css/+cs+.css" rel="stylesheet" type="text/javascript" />

將無法正常工作，您無法在鏈接標記中使用該變量輸出，該類型也不能是text/javascript。

來源

2012-02-16 09:34:54 SpaceBison

使用javascript添加動態CSS？

回答

相關問題