CSS 不会在类名切换时激活

CSS wont activate on classname switch

本文关键字：激活 CSS      更新时间：2023-09-26

我的CSS有问题，默认的类名是"qFrame"。然后我有一个函数，将类名更改为谢里登。在我的CSS文件中，我有一个选择器".sheridan p"，它应该改变"p"标签的颜色，但它不起作用。

JavaScript 函数：

function sheridan()
{
    var e = document.getElementsByClassName("qFrame");
    for (var i=0; i<e.length; i+=0)
       e[i].className = "sheridan";   
}

CSS 文件：

.sheridan {
    background-color: #33ABFD;
    border: 3px solid orange;
    border-spacing: 10px;
    overflow: hidden;
    padding-bottom: 10px;
    padding-left: 10px;  
}
.sheridan p {
    color: darkcyanblue;
}

编辑1：http://jsbin.com/hisasorusu/edit?html,css,js,output

调用sheridan()的函数已成功调用，但它绑定到名为"默认"的链接，而不是"Sheridan"。

基本上，您应该更改此设置：

Choose Theme:
<a href="#" onclick="sheridan()">Default</a> | 
<a href="#">Sheridan</a> | 
<a href="#">Candy</a>

进入这个：

Choose Theme:
<a href="#">Default</a> | 
<a href="#" onclick="sheridan()">Sheridan</a> | 
<a href="#">Candy</a>

这是固定的小提琴。我添加了一个back2default()功能作为附加功能。

你可以使用 jQuery，然后你的代码可以看起来像这样：

 $('.qFrame').addClass('sheridan');

它会立即改变你的班级。

相关文章：