如何通过脚本改变CSS双类属性

Question

在JQuery UI中，有很多CSS双类，例如JQuery UI的tab

.ui-widget-content .ui-state-default  
{
    border: 3px solid #EEEEEE;      
    background: #ffffff url(BGDel.png) repeat-x; 
    font-weight: bold; 
    color: #ffffff; outline: none; 
}

如果它在CSS文件中，上面的工作很好。

我想用javascript/Jquery来改变其中一个属性，比如

$(".ui-widget-content .ui-state-active").css({"font-weight":"normal"} );

它不工作。谁能帮助如何设置或改变CSS双类属性通过脚本?谢谢。

Answer 1

$(".ui-widget-content .ui-state-active").css({"font-weight":"normal"} );

这一行并不改变CSS类本身，它只选择与此选择器.ui-widget-content .ui-state-active匹配的元素。

所以请做一个"检查元素"，例如在firebug或谷歌开发工具，找到所需的元素，看看你是否使用正确的选择器。

由于.css()函数将所有给定的代码放入style属性，它应该覆盖CSS文件中的任何类，所以我认为，您应该尝试不同的选择器来匹配您的元素。

Answer 2

有两个类应用于您的元素，第一个是.ui-widget-content，第二个是.ui-state-default。在您的示例中，您将css设置为.ui-widget-content或.ui-state-active。但这是不正确的，因为另一个css .ui-state-default应用于该元素。

所以你需要使用!important或者也为.ui-state-default类应用jquery代码

try -

$("。css('font-weight'， 'normal!重要");

或

$(".ui-state-default"). css("粗细"、"正常");//使用css('font-weight'， '400');

或

$("。css('font-weight'， 'normal');