addClass()方法是jQuery中的一个内置的方法，该方法用于向每个选中的元素添加更多的属性；它还可以用来更改所选元素的属性。下面本篇文章就来给大家介绍一下addClass()方法，希望对大家有所帮助。
jQuery addClass()方法的使用
addClass()方法可以以两种不同的方式使用，下面具体介绍一下。
1、直接添加类名：
在这里，类名可以直接与将要选择的元素一起使用。
语法：
$(selector).addClass(className);
参数：它接受一个参数“className”，它是要添加的类的名称。
返回值：返回添加了新类的选定元素。
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
p {
margin: 8px;
<em style="color:transparent">来源[email protected]搞@^&代*@码网</em> font-size: 35px;
}
.selected {
color: ;
display: block;
border: 2px solid green;
width: 200px;
height: 60px;
background-color: lightgreen;
padding: 20px;
}
.highlight {
background: yellow;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js">
</script>
</head>
<body>
<p>测试文本1！</p>
<p>测试文本2！</p>
<p>测试文本3！</p>
<script>
$("p").first().addClass("selected");
$("p").last().addClass("highlight");
</script>
</body>
</html>
在上面的代码中，选择了“p”元素，并且在jQuery的.first()方法和.addClass()方法的帮助下，将“selected”类仅应用于第一个“p”元素。在.last()方法和.addClass()方法的帮助下，将“highlight”类仅应用于最后一个“p”元素。
2、通过传递一个函数来添加新类：
在这里，可以将函数传递给所选元素的.addClass()。
语法：
$(selector).addClass(function);
参数：接受参数“function”。
返回值：返回带有添加函数的选定元素。
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
div {
background: white;
margin: 20px;
}
.red {
background: red;
width: 300px;
margin: 20px;
}
.red.green {
background: lightgreen;
margin: 20px;
border: 2px solid green;
}
body {
border: 2px solid green;
width: 350px;
height: 200px;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js">
</script>
</head>
<body>
<div>这个div应该是白色的</div>
<div class="red">这个div将是绿色的，因为它现在有"green"和"red"类。</div>
<div>这个div应该是白色的</div>
<script>
$("div").addClass(function(index, currentClass) {
var addedClass;
if(currentClass === "red") {
addedClass = "green";
}
return addedClass;
});
</script>
</body>
</html>
在上面的代码中，选择了“div”元素，并且在函数的帮助下，将新类添加到所选的div元素中。
以上就是jQuery的addClass()方法怎么用？的详细内容，更多请关注gaodaima搞代码网其它相关文章！
搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：jQuery的addClass()方法怎么用？
转载请注明原文链接：jQuery的addClass()方法怎么用？
