Dengan menukar nama kelas secara dinamik, anda boleh mengubah suai elemen untuk menunjukkan kesan yang berbeza. Dalam struktur HTML, berbilang kelas dipisahkan oleh ruang Apabila nod (atau label) mengandungi berbilang kelas, atribut className bagi respons elemen DOM tidak memperoleh tatasusunan nama kelas, tetapi rentetan yang mengandungi ruang operasi berbilang kelas sangat menyusahkan. Pembangun jQuery yang sama juga mempertimbangkan situasi ini dan menambahkan kaedah .addClass() untuk menambahkan nama kelas secara dinamik
addClass( className ) kaedah
Lihat kod berikut:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> <style type="text/css"> div{ width:200px; height:200px; } .bg{ background:red; } </style> </head> <body> <div id="div">php 中文网</div> <script type="text/javascript"> $("#div").addClass('bg'); </script> </body> </html>
removeClass() Alih keluar gaya
Kes berikut:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> <style type="text/css"> .div{ width:200px; height:200px; background:red; } </style> </head> <body> <div class="div">php 中文网</div> <script type="text/javascript"> $(".div").removeClass("div"); </script> </body> </html>
Kod di atas, supaya gaya div kami dipadamkan