與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()方法:
jQuery的removeClass()方法
下面的示例演示如何從不同的元素刪除特定的類屬性:
jQuery的toggleClass()方法
下面的例子將展示如何使用jQuery的toggleClass()方法。 這種方法添加/從選定內容刪除類之間切換:
jQuery的css()方法
jQuery的css()方法將在下一章解釋。
自測練習用!
jQuery的CSS參考
對於所有的jQuery的CSS方法的完整概述,請訪問我們的jQuery HTML / CSS參考 。