使用JavaScript更改CSS

使用JavaScript更改CSS時，JavaScript是否只需製作帶有總統的新內聯CSS？我一直覺得內聯CSS很垃圾，想知道是否有更好的方法？使用JavaScript更改CSS

例如，如果你有

<div id="author">Author's name</div>這是正常顏色爲綠色，從外部CSS參考，並要將其變爲紅色必須在使用

document.getElementById('author').style.color='#FF0000'

必然選擇更改外觀做使用內聯stying？

來源

2013-02-06 Celeritas

不，你不修改CSS。你只是設置style屬性。元素的標記由三件事決定：CSS，style和內聯屬性，如width="100"。它們的應用順序可能會有點模糊。

style確實總是推翻CSS，除非你使用!important。

更改元素標記的更常見方法是添加和刪除類。這使您可以將所有樣式定義保留在CSS文件中，並使代碼大大簡化。

你可以這樣做：

document.getElementById('author').className = "selected";

一類添加到它，並讓它在不同的標記顯示。

如果您使用jQuery，您可以使用addClass和removeClass。在引擎蓋下，這只是修改className屬性。編寫你自己的實現很簡單，你只需要做一些字符串處理。

來源

2013-02-06 01:39:28 Halcyon

最後一段就是我正在尋找！ – Celeritas

它不再是最後一段，但，很酷:) – Halcyon

@Celeritas - 也問自己*爲什麼*它是綠色的，*爲什麼*它變成了紅色，並根據這些原因挑選你的類名（class =「green」）... ...你可以有'id =「author」class =「selected」'和規則說'＃author.selected {color：＃FF0000; }' –

有多種方法可以更改HTML元素的樣式。如果使用jQuery的，舉例來說，你可以添加/輕鬆去除類名的元素，像這樣：

$("div").addClass("className");

來源

2013-02-06 01:41:46 BinaryTox1n

它始終是清潔的定義在類的所有樣式，以便你可以改變整個應用程序的外觀和感覺輕鬆而不是使用內聯樣式。

這樣做最簡單的方法是定義一個CSS類

.reddiv {color: #FF0000}

，那麼你可以很容易的div顏色更改爲紅色使用jQuery

$('#author').addClass('reddiv');

來源

2013-02-06 01:53:08

回答

相關問題