1. 程式人生 > 實用技巧 >jQuery增刪元素類名

jQuery增刪元素類名

jQuery增刪元素類名

作用等同於以前的classList,可以操作類樣式,注意操作類裡面的引數不要加點

1、新增類

  $("div").addClass("current");

2、刪除類

  $("div").removeClass("current");

3、切換類

  $("div").toggleClass("current");

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content
="width=device-width, initial-scale=1.0"> <script src="js/jquery.min.js"></script> <style> div { width: 100px; height: 100px; background-color: pink; transition: all, .3s; } .current { width
: 200px; height: 200px; background-color: red; transform: rotate(360deg); } </style> <title>Document</title> </head> <body> <div class="current"></div> <script> $(function() { $('div
').click(function() { // $(this).addClass('current'); }) $('div').click(function() { // $(this).removeClass('current'); }) $('div').click(function() { $(this).toggleClass('current') }) }) </script> </body> </html>