描述：
jquery添加删除样式类
实现：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.div0
{
width: 100px;
height: 100px;
background-color: red;
}
.div1
{
background-color: black;
color: white;
}
.div2
{
background-color: deepskyblue;
color: red;
}
</style>
<script src="node_modules/jquery/dist/jquery.js"></script>
</head>
<body>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<script>
// $("div").addClass("div0");
//添加多个class
$("div").addClass("div0");
// $("div").removeClass("div0");
// $("div").removeClass("div0 div1");
// $("div").toggleClass("div2");
// $("div").toggleClass("div2 div0");
var arr=["div1","div2"];
$("div").hover(function () {
/*
* 第一个参数是切换类，这个必须写在交互的事件中
* 才会有切换效果
* 第二个参数是布尔值，如果是true就是不切换回去，如果是false就是不切换
* 如果默认不填，表示来回切换
*
*
* */
$(this).toggleClass("div2")
// $("div").addClass("div2");
/*
* 可以在toggleClass()里面增加函数，目的是切换多个元素使用
* 第一个参数是索引值
* 第二个参数是当前切换样式Class
* return 返回当前需要切换到的样式Class
*
* */
/* $("div").toggleClass(function (a,b,c) {
// console.log(a,b,c)
return arr[a%2];
})*/
})
</script>
</body>
</html>
6275
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
