CSS樣式與JS樣式，在網(wǎng)頁開發(fā)中都有各自重要的作用。CSS可以決定元素的外觀、位置、大小等，而JS則可以實(shí)現(xiàn)交互效果、動態(tài)修改頁面內(nèi)容等。當(dāng)一個元素同時(shí)被CSS和JS樣式設(shè)置了不同的屬性，那么究竟哪個樣式優(yōu)先呢？

在這個問題上，可以通過規(guī)定樣式的特定屬性來判斷優(yōu)先級。

/* 優(yōu)先級順序?yàn)椋簝?nèi)聯(lián)樣式 >ID選擇器 >類選擇器/偽類選擇器/屬性選擇器 >元素選擇器/偽元素選擇器 */
#box {
background-color: blue;
}
.box {
background-color: red;
}
div {
background-color: green;
}
<div id="box" class="box"></div>

如上述代碼所示，使用ID選擇器設(shè)置的背景色（藍(lán)色）會優(yōu)先于類選擇器和元素選擇器設(shè)置的背景色（紅色和綠色）。如果在JS文件中使用setAttribute()方法修改該元素的背景色屬性，那么就會發(fā)現(xiàn)此時(shí)JS樣式的優(yōu)先級要高于CSS樣式。

document.getElementById("box").style.backgroundColor = "black";

上述JS代碼會將該元素的背景色設(shè)置為黑色，同時(shí)覆蓋掉CSS設(shè)置的藍(lán)色背景色。

總體來說，當(dāng)CSS樣式與JS樣式存在沖突時(shí)，優(yōu)先級是由CSS樣式?jīng)Q定的，但是如果使用JS動態(tài)修改樣式屬性，那么該屬性的優(yōu)先級就是最高的。