【jQuery】jQuery操作class详细说明

1、给指定目标添加class：addClass

<div id="headerDiv" class="divcss1"></div>
<script>
    $('#headerDiv').addClass('divcss2');
</script>

//执行后div headerDiv有两个class：divcss1和divcss2

2、删除指定目标中的class：removeClass

<div id="headerDiv" class="divcss1 divcss2"></div>
<script>
    $('#headerDiv').removeClass('divcss2');
</script>

//执行后，div headerDiv剩下一个class：divcss1

3、修改指定目标的class

第一种：追加
//先删除后添加（移除后追加）
//或者先添加后删除（追加后移除）
<div id="headerDiv" class="divcss1 divcss2 divcss3"></div>
$("#headerDiv").addClass("divcss1").removeClass("divcss2");//执行后会保留divcss1和divcss3
$("#headerDiv").removeClass("divcss1").addClass("divcss2");//执行后会保留divcss2和divcss3

第二种：替换（只保留一个）
//attr方法
$("#headerDiv").attr("class","divcss3");//执行后只保留divcss3这一个class

4、判断指定目标中是否存在某个class：hasClass

<div id="headerDiv" class="divcss1 divcss2 divcss3"></div>
$("#headerDiv").hasClass("divcss1");//返回值是一个boolean值，存在返回true，不存在返回false