版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_38242407/article/details/78087285
获取并设置CSS类
方法调用格式相同，所以我们先写方法介绍，最后一起写个例子巩固。
addClass()
向被选元素添加一个类。
removeClass()
向被选元素删除一个类。
toggleClass()
向被选元素切换进行添加或删除类。
示例代码
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("button#test1").click(function(){
$("p#a").addClass("xinpeng2");//添加类
$("p#b").removeClass("xinpeng1");//删除类
});
$("button#test2").click(function(){
$("div").toggleClass("xinpeng1"); //切换类
});
});
</script>
<style type="text/css">
.xinpeng1
{
font-weight:bold;
font-size:xx-large;
}
.xinpeng2
{
color:blue;
}
</style>
</head>
<body>
<p id="a">Hello jQuery！</p>
<p id="b" class="xinpeng1">I love jQuery！</p>
<div class="xinpeng1">I love jQuery so much！</div>
<br>
<button id="test1">向元素添加或删除类</button>
<button id="test2">切换</button>
</body>
</html>
class()方法
返回或设置样式。
返回CSS样式
$(“”).css(“属性名”)；
设置一个或多个CSS样式
采用键值对的模式设置一个或多个样式。
设置一个样式：css(“属性名”,”值”);
设置多个样式的话，一个键值对中间用冒号，两个属性之间用逗号隔开。
css(“属性名1”:”值1”,”属性名2”:”值2”,… …);
示例代码
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("button#xinpeng1").click(function(){
alert($("p#a").css("background-color"));//获取样式
});
$("button#xinpeng2").click(function(){
$("p#b").css({"background-color","yellow");//设置一个样式
});
$("button#xinpeng3").click(function(){
$("p#c").css({"background-color":"yellow","font-size":"200%"});//设置多个样式
});
});
</script>
</head>
<body>
<p id="a" style="background-color:#ff0000">Hello jQuery！</p>
<p id="b" >Hello jQuery！</p>
<p id="c" >Hello jQuery！</p>
<button id="xinpeng1">返回样式</button>
<button id="xinpeng2">设置一个样式</button>
<button id="xinpeng3">设置多个样式</button>
</body>
</html>