常見的用途

在HTML裡，多個class以空格分隔，當一個節點（或稱為一個標籤）含有多個class時，DOM元素響應的className屬性獲取的不是class名稱的陣列，而是一個含有空格的字串，這就使得多class操作變得很麻煩。

而jQuery已經將原來解析字串等精細的操作變成了很簡潔的API。例如，addClass()就是新增class類名，removeClass()就是移除class類名，這裡您想新增幾個class就新增幾個，想移除幾個就可以移除幾個。於是呢，在jQuery裡，很多看似複雜的樣式效果就變得非常簡單，小菜一碟了。

//====按鈕切換顏色（兩個箭頭樣式的切換）

addClass() 方法

• 向被選元素新增一個或多個類

--展示如何向不同的元素新增 class 屬性。該例子、；點選button按鈕時候，對p元素新增一個blue的屬性，而blue屬性是顏色變藍
    --jquery樣式
    $("button").click(
        $("p").addClass("blue");
    );
    --css樣式
    .blue
    {
    color:blue;
    }

removeClass()

• 從被選元素刪除一個或多個類

--該例子、；點選button按鈕時候，對p元素刪除一個blue的屬性
    $("button"
 
).click(function(){
      $("p").removeClass("blue");
    });

siblings() 方法

siblings() 方法返回被選元素的所有同胞元素。

--jquery樣式
$(document).ready(function(){
  $("h2").siblings();
});

--css樣式
<div>div (parent)
  <p>p</p>
  <span>span</span>
  <h2>h2</h2>
  <h3>
 
h3</h3>
  <p>p</p>
</div>

--結果是：返回 <h2> 的所有同胞元素：p,span,h3,p

結合起來的例項

--css的樣式
<div class="tss">
    <span class="ts1 ts1s" data-type="0">寶貝</span>
    <span class="ts1" data-type="1">店鋪</span>                   
</div>

--jquery樣式
    點選事件
        $('.tss .ts1').click(function(){		   	   $(this).addClass('ts1s').siblings().removeClass('ts1s')                                
    })