.addClass()：給DOM元素添加類名，間接控制樣式

.removeClass()：移除DOM元素的樣式

.hasClass()：判斷DOM元素是否有某類名

【例】代碼功能：點擊換膚。原理：設置active樣式，判斷DOM元素是否有active類名，若沒有則添加類名，有則移除類名

html代碼如下

<div class="wrapper"><div class="demo">我抓不住這世界的美好，只能裝作萬事順遂</div><div class="demo">我只怕從來沒有在你的世界出現過</div><div class="demo">我喜歡你，認真且慫，從一而終</div> </div>

css代碼

.wrapper .demo {width: 350px;height: 50px;line-height: 50px;text-align: center;border-radius: 20px;background: linear-gradient(to right, steelblue, cadetblue );font-size: 16px;color: #fff;margin-bottom: 5px; } .wrapper.active .demo{background-color: darkseagreen;background: linear-gradient(to right, teal, darkseagreen); }

js代碼

<script src="./jquery.js"></script> <script> $('.wrapper').click(function (index, ele) {if ($(this).hasClass('active')) {$(this).removeClass('active');} else {$(this).addClass('active');} }) </script>

結果

點擊后

總結

以上是生活随笔為你收集整理的jQuery对类的操作.addClass()/.removeClass()/.hasClass()方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。