jquery实现相同class的元素，点击动态切换背景色和字体

最新推荐文章于 2022-03-10 09:02:46 发布

hdream_128

最新推荐文章于 2022-03-10 09:02:46 发布

阅读量823

点赞数

文章标签：动态切换背景和字体 jquery 相同class

本文链接：https://blog.csdn.net/hdream_128/article/details/102515789

版权

	<div class="choose">
		<div class="btn btn-use">选择1</div>
		<div class="btn btn-new">选择2</div>
		<!--<div class="btn btn-new">可以有多个选择进行切换</div>-->
	</div>

	.btn-use{color: #fff;background-color: #1FB5AC;}
	.btn-new{color: #4F9591;}

/**
 * jquery实现相同class的元素，点击动态切换背景色和字体
 */
 $('.btn').click(function(){
	//同级失去class，点击的元素获得class
	$(this).siblings().removeClass('.btn-use');
	$(this).siblings().addClass('.btn-new');
	$(this).removeClass('.btn-new');
	$(this).addClass('.btn-use');
 })