（十三）jQuery addClass()和removeClass()方法

最新推荐文章于 2023-12-10 19:02:02 发布

北斗星的爱886

最新推荐文章于 2023-12-10 19:02:02 发布

阅读量702

点赞数

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

本文链接：https://blog.csdn.net/zhangjie2016/article/details/118543302

版权

18 篇文章 2 订阅

订阅专栏

本文详细介绍了如何使用jQuery的addClass(), removeClass(), toggleClass()方法在HTML元素上操作类，包括添加类后的样式变化、删除类前后的效果对比以及切换类操作的演示。通过实例演示，帮助理解在前端开发中如何灵活运用这些方法来控制元素样式。

摘要由CSDN通过智能技术生成

向被选元素添加一个或多个类

CSS：

.addClass{
			width: 400px;
			height: 100px;
			border: 1px solid #000;
			background-color: pink;
			font-size: 18px;
		}

HTML：

<div>
		你的爱,会将我灌醉,我没有所谓,太过清醒怎么陶醉.
		-----好好学习，天天向上。
</div>

JS：
在这里插入图片描述

添加class属性前：
在这里插入图片描述

添加class属性后：
在这里插入图片描述

从被选元素删除一个或多个类

CSS：

.removeClass{
			width: 400px;
			height: 100px;
			border: 1px solid #000;
			background-color: pink;
			font-size: 18px;
		}

HTML：

	<div class="removeClass">
		你的爱,会将我灌醉,我没有所谓,太过清醒怎么陶醉.
		-----好好学习，天天向上。
	</div>

	<br>
	<button>删除class属性</button>

JS：
在这里插入图片描述
删除class属性前：

删除class属性后：
在这里插入图片描述

对被选元素进行添加/删除类的切换操作

在这里插入图片描述

关注

专栏目录