JQuery中操做Css樣式的方法

獲取和設置樣式

$("#tow").attr("class")//獲取ID爲tow的class屬性

$("#two").attr("class","divClass")//設置Id爲two的class屬性。

追加樣式

$("#two").addClass("divClass2")//爲ID爲two的對象追加樣式divClass2

移除樣式

$("#two").removeClass("divClass")//移除 ID爲two的對象的class名爲divClass的樣式。
$("#two").removeClass("divClass divClass2")//移除多個樣式。

切換類名

$("#two").toggleClass("anotherClass") //重複切換anotherClass樣式

判斷是否含有某項樣式

$("#two").hasClass("another")==$("#two").is(".another");

獲取css樣式中的樣式

$("div").css("color") //設置color屬性值. $(element).css(style)

設置單個樣式

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

設置多個樣式

$("div").css({fontSize:"30px",color:"red"})

$("div").css("height","30px")==$("div").height("30px")

$("div").css("width","30px")==$("div").height("30px")

offset()方法

它的做用是獲取元素在當前視窗的相對偏移,其中返回對象包含兩個屬性,即top和left 。javascript

**注意:**只對可見元素有效。css

var offset=$("div").offset();

var left=offset.left;         //獲取左偏移

var top=offset.top;        //獲取右偏移

###position()方法java

它的做用是獲取元素相對於最近的一個position樣式屬性設置爲relative或者absolute的祖父節點的相對偏移,與offset()同樣,它返回的對象也包括兩個屬性即top和left。ide

scrollTop()方法和scrollLeft()方法

$("div").scrollTop();       //獲取元素的滾動條距頂端的距離。
$("div").scrollLeft();         //獲取元素的滾動條距左側的距離。

jQuery中的 toggle和slideToggle 方法,均可以實現對一個元素的顯示和隱藏。區別是:

  • toggle:動態效果爲從右至左。橫向動做。code

  • slideToggle:動態效果從下至上。豎向動做。對象

好比想實現一個樹由下至上收縮的動態效果,就使用slideToggle就ok了。ip

$('input').attr("readonly",true)//將input元素設置爲readonly
$('input').attr("readonly",false)//去除input元素的readonly屬性
$('input').attr("disabled",true)//將input元素設置爲disabled
$('input').attr("disabled",false)//去除input元素的disabled屬性
相關文章
相關標籤/搜索