本文目錄導(dǎo)讀：

1. 直接操作樣式
2. 操作class
3. 操作id
4. 使用CSSStyleSheet對象

在JavaScript中使用CSS樣式的方法

JavaScript和CSS是兩種常用的前端技術(shù)，它們可以相互協(xié)作，實(shí)現(xiàn)豐富的網(wǎng)頁效果，在JavaScript中使用CSS樣式，可以通過操作DOM（文檔對象模型）來實(shí)現(xiàn)。

直接操作樣式

在JavaScript中，可以通過獲取元素的style屬性來直接操作元素的樣式，要設(shè)置一個(gè)元素的背景顏色，可以這樣做：

element.style.backgroundColor = "red";

操作class

JavaScript還可以通過操作元素的class屬性來應(yīng)用CSS樣式，需要在CSS中定義好樣式類，然后在JavaScript中獲取元素的class屬性并進(jìn)行修改。

element.className = "myClass";

在CSS中定義樣式類：

.myClass {
  background-color: blue;
}

操作id

與操作class類似，JavaScript也可以通過操作元素的id屬性來應(yīng)用CSS樣式，需要在CSS中定義好樣式類，然后在JavaScript中獲取元素的id屬性并進(jìn)行修改。

element.id = "myId";

在CSS中定義樣式類：

#myId {
  color: green;
}

使用CSSStyleSheet對象

JavaScript還提供了CSSStyleSheet對象，可以用來操作CSS樣式表，通過獲取元素的sheet屬性，可以獲取到該元素所在的樣式表，然后對該樣式表進(jìn)行操作。

var stylesheet = element.sheet;
var rule = stylesheet.cssRules[0]; // 獲取***條規(guī)則
rule.style.color = "black"; // 修改規(guī)則中的顏色屬性

是在JavaScript中使用CSS樣式的幾種方法，可以根據(jù)具體的需求選擇適合的方法。