JavaScript是一款功能強(qiáng)大的編程語言，能夠與HTML和CSS共同構(gòu)建互動(dòng)性強(qiáng)，外觀美觀的網(wǎng)站。在JavaScript中使用CSS有兩種方法：內(nèi)聯(lián)樣式和外部樣式。在本文中，我們將介紹兩種方法的具體步驟。
內(nèi)聯(lián)樣式：
<html>
<head>
<script>
function changeColor() {
var element = document.getElementById('text');
element.style.color = 'red';
}
</script>
</head>
<body>
<p id="text">這是一段文本</p>
<button onclick="changeColor()">改變顏色</button>
</body>
</html>在上述代碼中，我們使用了JavaScript來修改ID為"text"的段落的文字顏色。我們使用了element.style.color來改變文字顏色。這就是內(nèi)聯(lián)樣式的使用方法。但是，這種方法很繁瑣，當(dāng)樣式更加復(fù)雜時(shí)，內(nèi)聯(lián)樣式并不是最好的選擇。
外部樣式：
使用外部樣式，我們需要在HTML文檔的頭部使用link標(biāo)記將樣式文件鏈接到HTML文檔中。
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script>
function changeColor() {
var element = document.getElementById('text');
element.classList.add('red');
}
</script>
</head>
<body>
<p id="text">這是一段文本</p>
<button onclick="changeColor()">改變顏色</button>
</body>
</html>在上述代碼中，我們使用了class來為段落定義樣式。我們?cè)趕tyle.css文件中定義了樣式。
.red {
color: red;
}在上面的代碼中，我們定義了一個(gè).red的class，并為文本顏色設(shè)置為紅色。在JavaScript中，我們使用element.classList.add('red')來為ID為text的元素添加.red的class，從而改變文本顏色。
通過使用外部樣式，我們可以將所有的樣式和JavaScript分離，使我們的代碼更加清晰、易于維護(hù)。