jquery動態新增，刪除class樣式

獲取class和設定class都可以使用attr()方法來完成。例如使用attr()方法來獲取p元素的class，jquery**如下：

var p_class = $("p").attr("class"); //獲取p元素的class

使用attr()方法來設定p元素的class，jquery**如下：

$("p").attr("'class", "high"); //設定p元素的class為 "high"

大多數情況下，它是將原來的class替換為新的class，而不是在原來的基礎上追加新的class。

追加樣式什麼是追加class呢？假如p元素原本的class為myclass，那麼追加乙個名叫high的class後，class屬性變為「myclass high」，即myclass和high兩種樣式的疊加。

jquery提供了專門的addclass()方法來追加樣式。為了使例子更容易理解，首先在 style標籤裡新增另一組樣式：

1 .high

2 .another

後在網頁中新增乙個「追加class類」的按鈕，按鈕的事件**如下：

$("#btn_3").click(function());

後當單擊「追加class類」按鈕時，p元素樣式就會變為斜體，而先前的紅色字型也會變為藍色。此時p元素同時擁有兩個class值，即"high"和"another"。在css中有以下兩條規定。

1.如果給乙個元素新增了多個class值，那麼就相當於合併了它們的樣式。 2.如果有不同的class設定了同一樣式屬性，則後者覆蓋前者。在上例中，相當於給p元素新增了如下樣式：

color : red; /* 字型顏色設定紅色*/

font-style:italic;

color:blue;

以上的樣式中，存在兩個「color」屬性，而後面的「color」屬性會覆蓋前面的「color」屬性，因此最終的「color」屬性的值為「blue」，而不是「red」。

移除樣式如果使用者單擊某個按鈕時，要刪除class的某個值，那麼可以使用與addclass()方法相反的removeclass()方法來完成，它的作用是從匹配的元素中刪除全部或者指定的class。例如可以使用如下的jquery**來刪除p元素中值為「high」的class:

$("p").removeclass("high"); //移除p元素中值為"high"的class

如果要把p元素的兩個class都刪除，就要使用兩次removeclass()方法，**如下：

$("p").removeclass("high").removeclass("another");

jquery提供了更簡單的方法。可以以空格的方式刪除多個class名，**如下：

$("p").removeclass("high another");

其外，還可以利用removeclass()方法的乙個特性來完成同樣的效果。當它不帶引數時，就會將class的值全部刪除，jquery**如下：

$("p").removeclass(); //移除p元素的所有class

換樣式 jquery中有乙個方法toggle()，jquery**如下：

togglebtn.toggle(function(), function())

toggle()方法此處的作用是交替執行**③和**④兩個函式，如果元素原來是顯示的，則隱藏它：如果元素原來是隱藏的，則顯示它。此時，toggle()方法主要是控制行為上的重複切換。

另外jquery還提供了乙個toggleclass()方法控制樣式上的重複切換。如果類名存在則刪除它，如果類名不存在則新增它。例如對p元素進行toggleclass()方法操作。

$("p").toggleclass("another"); //重複切換類名「another」

不斷單擊「切換樣式」按鈕時，p元素的class的值就會在「myclass」和「myclass another」之間重複切換。

判斷是否含有某個樣式 hasclass()可以用來判斷元素中是甭含有某個class，如果有，則返回true，否則返回false。例如可以使用下面的**來判斷p元素中是否含有「another」的class：

$("p").hasclass("another");

方法是為了增強**可讀性面產生的。在jquery內部實際上是呼叫了is()方法來完成這個功能的．該方法等價於如下**：

$("p").is(".another"); //is("."+class);