在 css 文件 href Javascript 中更改 css 类背景

Change a css class background in css file href Javascript

本文关键字：css 背景 Javascript 文件 href      更新时间：2023-09-26

我正在尝试在 JavaScript 中更改 Css 文件选择器类，但我使用的代码不起作用！

尝试在我的 Css 中更改这个类 - 

.block-square {
  background-color:rgb(167,128,209);
}

我想更改此类的背景颜色。

css href 在这里<link id="myStyleSheet" href="css/style.css" rel="stylesheet">这是它所在的位置。

这是我的代码不起作用：

function styleOne() {
    document.getElementById('myStyleSheet').href = 'css/style.css';
    var square = document.querySelector(".block-square");
    square.style.backgroundColor = "#ffffff";
}

请让我知道为什么此代码不起作用。

如果您只想更改.block-square的background-color，这里有一个示例。

$("#styleOne").click(function() {
  $(".block-square").css("background-color", "#FFFFFF");
});
$("#styleTwo").click(function() {
  $(".block-square").css("background-color", "rgb(167,128,209)");
});
.block-square {
  width: 100px;
  height: 100px;
  background-color: rgb(167, 128, 209);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="block-square"></div>
<button id="styleOne">StyleOne</button>
<button id="styleTwo">StyleTwo</button>

使用 jQuery，它就容易多了。

function styleOne() {
  $(".block-square").css("background-color","yellow");
}
相关文章：