jquery设置css样式属性(jquery获取css属性值方法)

一、jquery获取样式(读)方法

$("div").css("width"); 
$("div").css("color");

二、jquery设置样式(写)方法

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

注意:选择器获取的多个元素,获取信息获取的是第一个,比如:$("div").css("width"),获取的是第一个div的width。

三、jquery操作样式类名

//为id为div1的对象追加样式divClass2
$("#div1").addClass("divClass2") 
//移除id为div1的对象的class名为divClass2的样式
$("#div1").removeClass("divClass2") 
//移除多个样式
$("#div1").removeClass("divClass divClass2") 
//重复切换anotherClass样式,把'.div1'的样式切换成'anotherClass'的样式
$(".div1").toggleClass("anotherClass")

注:这里的toggleClass需结合click事件使用,如点击按钮改变样式。

四、toggleClass演示:

1、js代码



    $(function(){
 	$('#btn').click(function(){
 	   $('.box').toggleClass('sty');
 	});
    });

2、css代码

 
  .box{ width: 200px; height: 200px; background-color: gold; } 
  .sty{ background-color: pink; } 

3、html代码

 
版权声明:
作者:Joker 链接:https://456787.xyz/archives/293830
文章版权归作者所有,转载请注明出处。
THE END
分享
二维码
打赏
)">
< <上一篇
)">
下一篇>>