JQueryでのCssスタイルの操作

2009 ワード


 
//1、       



$("#tow").attr("class")  ID tow class  



$("#two").attr("class","divClass")  Id two class  。



//2、    



$("#two").addClass("divClass2") ID two       divClass2



//3、    



$("#two").removeClass("divClass")   ID two    class  divClass   。



$(#two).removeClass("divClass divClass2")      。



//4、    



$("#two").toggleClass("anotherClass") //    anotherClass  



//5、          



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



//6、  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")



//7.offset()  



//                   ,            , top left 。



//  :        。



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



var left=offset.left;         //     



var top=offset.top;        //     



//8、position()  



//                 position       relative  absolute          , offset()  ,              top left。



//9、scrollTop()   scrollLeft()  



$("div").scrollTop();        //              。



$("div").scrollLeft();         //              。



//10、jQuery   toggle slideToggle   ,                。   :



//toggle:         。    。



//slideToggle:        。    。



//                   ,   slideToggle ok 。



$('input').attr("readonly",true)// input     readonly

$('input').attr("readonly",false)//  input   readonly  

$('input').attr("disabled",true)// input     disabled

$('input').attr("disabled",false)//  input   disabled