jQuery CSS类

使用jQuery，它很容易操纵元素的CSS.

jQuery 操纵 CSS

jQuery有几个操纵CSS的方法如下：

• addClass() - 将一个或多个类添加到所选元素中
• removeClass() - 从所选元素中移除一个或多个类
• toggleClass() - 添加/删除类从选定的元素之间切换
• css() - 设置或返回样式属性

样式实例

下面的样式表，将用于在这页的所有例子:

.important {
    font-weight: bold;
    font-size: xx-large;
}

.blue {
    color: blue;
}

jQuery addClass() 方法

下面的示例演示如何向不同元素添加类属性。当然，当添加类时，您可以选择多个元素：

$("button").click(function(){
    $("h1, h2, p").addClass("blue");
    $("div").addClass("important");
});

让我试试

你也可以在addClass()方法中指定多个类：

$("button").click(function(){
    $("#div1").addClass("important blue");
});

让我试试

jQuery removeClass() 方法

下面的示例演示如何从不同元素中移除特定的类属性:

$("button").click(function(){
    $("h1, h2, p").removeClass("blue");
});

让我试试

jQuery toggleClass() 方法

下面的例子将展示如何使用jQuery toggleClass() 方法. 该方法切换添加/删除类从选定的元素之间:

$("button").click(function(){
    $("h1, h2, p").toggleClass("blue");
});

让我试试

jQuery css() 方法

jQuery css() 方法将在下一章中解释。