1. 程式人生 > >jQueryDOM操作--樣式操作(css、className)

jQueryDOM操作--樣式操作(css、className)

1.基本樣式屬性操作

作用:設定或獲取元素的樣式屬性值。

2.設定樣式屬性操作

設定單個樣式(第一個引數為樣式的屬性名稱,第二個引數為樣式屬性值)

$(selector).css("color","red")

設定多個樣式,引數為物件,使用物件的形式設定一個或多個類和樣式(引數為物件)

$(selector).css({"color": "red", "font-size": "30px"});

3.獲取樣式屬性操作(引數為想要獲取的樣式屬性名稱)

var fs = $(selector).css("font-size");

==============================================================================================

4.新增類樣式(為指定元素新增類,引數為className)

$(selector).addClass("liItem");

5.移除類樣式(為指定元素移除類,引數為className或者是空)

$(selector).removeClass("liItem");
$(selector).removeClass();     //不指定引數,表示移除被選中元素的所有類

6.判斷有沒有類樣式(判斷一個元素是否包含某個類,引數為className)

var hasC = $(selector).hasClass("liItem");
// 此時,會返回true或false

7.切換類樣式(為指定元素切換類className,有就移除,沒有就新增)

$(selector).toggleClass("liItem");

8.注意點!!!!!!

1.操作的時候,所有的類名都不帶點(.)

2.樣式少可以用.css()來操作,樣式多的時候可以用類名來操作

3.站在維護方面上說,類名的使用更好(把css從html中分離出來)