jquery 操作类

最新推荐文章于 2024-08-09 02:16:38 发布

黄大仙No.1

最新推荐文章于 2024-08-09 02:16:38 发布

阅读量175

点赞数

分类专栏： jQuery 文章标签： js jquery css3

本文链接：https://blog.csdn.net/qq_44378358/article/details/108237853

版权

jQuery 专栏收录该内容

30 篇文章 0 订阅

订阅专栏

作用等同于以前的classList，可以操作类样式，注意操作类里面的参数不要加点。


1.添加类	`$(“div" ).addClass("current");`
2.移除类	`$(“div" ).removeClass("current");`
3.切换类	`$(“div" ).toggleClass("current");`

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Title</title>
		<script src="js/jquery-3.5.1.min.js"></script>
		<style>
			div {
				width: 200px;
				height: 150px;
				border: 1px solid red;
				transition: all .5s;
			}
			.current {
				background-color: pink;
				transform: rotate(360deg);
			}
		</style>
	</head>
	<body>
		<div></div>
	</body>
	<script>
		$(function () {
		    /*// 添加类
            $('div').click(function () {
                $(this).addClass('current');
            })
			//  移除类
            $('div').mouseleave(function () {
                $(this).removeClass('current');
            })*/
			//  切换类
			$('div').click(function () {
				$(this).toggleClass('current')
            })
        })
	</script>
</html>