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() 方法

下面的範例展示如何在不同的元素中新增class 屬性。當然，在新增類別時，您也可以選取多個元素：

       
  
静夜思
 
床前明月光
 
疑是地上霜
 
这是另外一个段落。
 
这是一些重要的文本!
 
 为元素添加 class  

您也可以在addClass() 方法中規定多個類別：

     
  
我会变哦
 
为什么我不行呢
 
 为第一个 div 元素添加类  

jQuery removeClass()方法

下面的範例示範如何在不同的元素中刪除指定的class 屬性：

       
  
静夜思
 
床前明月光
 
疑是地上霜
 
这是另外一个段落。
 
这是一些重要的文本!
 
 从元素中移除 class  

與addclass作用剛好相反。

jQuery toggleClass() 方法

屬性切換功能：

       
  
标题 1
 
标题 2
 
这是一个段落。
 
这是另外一个段落。
 
 切换 class  

jQuery css() 方法

css() 方法設定或傳回被選元素的一個或多個樣式屬性。

傳回CSS 屬性

如需傳回指定的CSS 屬性的值，請使用下列語法：

css("propertyname");

設定CSS 屬性

如需設定指定的CSS 屬性，請使用下列語法：

css("propertyname","value");

設定多個CSS 屬性

如需設定多個CSS 屬性，請使用下列語法：

css({"propertyname":" value","propertyname":"value",...});

      
  
这是一个标题
 
这是一个例子
 
这是一个例子
 
这是一个例子
 
这是一个例子
 为 p 元素设置多个样式