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

1. 獲取和修改元素樣式
2. 操作CSS樣式表
3. 使用CSSOM（CSS對(duì)象模型）

如何在JavaScript中操作CSS樣式表

在網(wǎng)頁(yè)開(kāi)發(fā)中，JavaScript（JS）和CSS（層疊樣式表）是兩種非常重要的技術(shù)，它們分別負(fù)責(zé)網(wǎng)頁(yè)的動(dòng)態(tài)行為和視覺(jué)表現(xiàn)，有時(shí)，我們需要在JavaScript中改變CSS樣式表以動(dòng)態(tài)調(diào)整網(wǎng)頁(yè)的外觀，本文將介紹如何在JavaScript中操作CSS樣式表。

獲取和修改元素樣式

在JavaScript中，我們可以通過(guò)訪問(wèn)元素的style屬性來(lái)獲取和修改元素的CSS樣式，如果我們想要改變一個(gè)元素的背景顏色，我們可以這樣做：

document.getElementById("myElement").style.backgroundColor = "blue";

這將把ID為"myElement"的元素的背景顏色改為藍(lán)色，這種方法只能改變內(nèi)聯(lián)樣式（即在HTML元素中直接定義的樣式），而不能改變?cè)贑SS樣式表中定義的樣式。

操作CSS樣式表

如果要修改在CSS樣式表中定義的樣式，我們需要使用更復(fù)雜的方法，我們可以通過(guò)操作DOM的link或style元素來(lái)加載或修改CSS樣式表，我們可以創(chuàng)建一個(gè)新的style元素，然后將它插入到文檔中：

var style = document.createElement('style');
style.innerHTML =.myClass { background-color: blue; };
document.head.appendChild(style);

這將創(chuàng)建一個(gè)新的樣式表，并添加一個(gè)新的樣式規(guī)則，將所有帶有.myClass類(lèi)的元素的背景顏色改為藍(lán)色。

使用CSSOM（CSS對(duì)象模型）

我們還可以使用CSSOM（CSS對(duì)象模型）來(lái)操作CSS樣式表，CSSOM提供了一種在JavaScript中訪問(wèn)和操作CSS的方法和對(duì)象，我們可以通過(guò)window.getComputedStyle()方法來(lái)獲取元素的計(jì)算樣式，通過(guò)修改元素的classList或className來(lái)更改元素的類(lèi)名等，這些操作可以影響在CSS樣式表中定義的樣式。

在JavaScript中操作CSS樣式表有多種方法，包括直接修改元素的style屬性，操作DOM的link或style元素，以及使用CSSOM，這些方法可以根據(jù)具體的需求和場(chǎng)景進(jìn)行選擇和使用，熟練掌握這些方法可以使我們?cè)诰W(wǎng)頁(yè)開(kāi)發(fā)中實(shí)現(xiàn)更多的動(dòng)態(tài)效果和交互功能。