jQuery樣式操作
.div2{
color:red;
}
.big{
font-size:30px;
}
$(function(){
/*jQuery用同一個(gè)函數(shù)即可以取值、也可以賦值*/
//讀取樣式
alert($('#div1').css('fontSize'));//16px
//設(shè)置（寫入）樣式
$('#div1').css({background:'gold'});
//增加行間樣式
$('#div1').addClass('big');
//減少行間樣式，多個(gè)樣式用空格分開(kāi)
$('#div1').removeClass('div2 big');
})
jquery用法思想二
同一個(gè)函數(shù)完成取值和賦值
操作行間樣式
// 獲取div的樣式
$("div").css("width");
$("div").css("color");
//設(shè)置div的樣式
$("div").css("width","30px");
$("div").css("height","30px");
$("div").css({fontSize:"30px",color:"red"});
特別注意
選擇器獲取的多個(gè)元素，獲取信息獲取的是第一個(gè)，比如：$("div").css("width")，獲取的是第一個(gè)div的width。
操作樣式類名
$("#div1").addClass("divClass2") //為id為div1的對(duì)象追加樣式divClass2
$("#div1").removeClass("divClass")? //移除id為div1的對(duì)象的class名為divClass的樣式
$("#div1").removeClass("divClass divClass2") //移除多個(gè)樣式
$("#div1").toggleClass("anotherClass") //重復(fù)切換anotherClass樣式
click事件
.box{
width:200px;
height:200px;
background-color:gold;
}
.sty{
background-color:green;
}
$(function(){
//給按鈕綁定click事件
$('#btn').click(function(){
//重復(fù)切換sty樣式
$('.box').toggleClass('sty');
})
})
