jQuery样式操作使用jQuery进行样式操作，设置类样式方法，类操作方法，删除，增加，切换类，链式编程的基本操作方法

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第7天，点击查看活动详情

1.如果样式较为简单，可以使用css方法来修改简单的元素样式，也可以操作类修改多个样式

1.1.如果参数只写属性名，则是返回属性值

$(this).css("color")

1.2.参数是属性名，属性值，逗号分隔，是设置成一组样式，属性必须加引号，值如果是数字可以不用跟单位和引号

$(this).css("color"，"red")

1.3.参数可以是对象形式，方便设置多组样式。属性名和属性值用冒号隔开，属性可以不用加引号

$(this).css({"color":"black"，"font-size":"50px"})

作用等同于以前的classList，可以操作类样式，操作类里面的参数不能加点 1.1.添加类

$("div").addClass("current")

例如当我们想要点击盒子，导致增加一个类,改变颜色

.current{
background-color:red
}
<script>
$(function(){
$("div").click(function(){
$(this).addClass("current")；  
})
})
</script>

1.2.删除类

$("div").removeClass("current")

取消先前的为

.current{
background-color:red
}
<script>
$(function(){
$("div").click(function(){
$(this).removeClass("current")；  
})
})
</script>

1.3.切换类 toggleClass( )

$("div").toggleClass("current")

.current{
background-color:red
}
<script>
$(function(){
$("div").click(function(){
$(this).toggleClass("current")；  
})
})
</script>

可以做出添加和移除这个类名

例如当一个案例中，要想要点击一个按钮，当前的元素颜色变成红色，其余的姐妹元素不变色

$("button").click(function(){
$(this).css("color",“red");
// 让其他的姐妹元素不变色
$(this).siblings().css("color"，"")
})

链式编程，因此由上面可得，转换为

$(this).css("color",“red").siblings().css("color"，"")

原生js中className会覆盖元素原先里的类名 jquery里类操作只是对指定类操作，不影响原先类名例如

<div class = "pink"></div>
<script>
var pink = document.querySelector(".pink");
pink.className = "red"
</script>

那么原先的pink类名就会变成red 对于jQuery来言

 <div class = "pink"></div>
 <script>
$(".pink").addClass("red")
 </script>

那么原先的pink类名还会存在，会增加一个red类名，不影响先前