jquery addClass() 和removeClass() 被选元素添加类名删除类名class属性的使用
1、addClass() 方法向被选元素添加一个或多个类名。
该方法不会移除已存在的 class 属性，仅仅添加一个或多个类名到 class 属性。
提示：如需添加多个类，请使用空格分隔类名。
2、removeClass() 方法从被选元素移除一个或多个类。
注意：如果没有规定参数，则该方法将从被选元素中删除所有类。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ padding: 0; margin: 0; } P{ float: left; width: 150px; height: 50px; line-height: 50px; text-align: center; font-size: 30px; color: white; background: darkmagenta; margin: 10px; } p.cur{ color: black; background: blue; font-size: 50px; } </style> <script src="../tu/jquery-1.11.3.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $('p').click(function(){ $(this).css({'background':'blue','color':'black','font-size':'50px'}).siblings('p').css({'background':'darkmagenta','color':'white','font-size':'30px'}) // 另一种方法 点击谁给谁加个'cur'的class样式 remove删除 兄弟元素的cur样式 $(this).addClass('cur').siblings('p').removeClass('cur'); }) }) </script> </head> <body> <p class="cur">1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> <p>6</p> <p>7</p> <p>8</p> </body> </html> 
本站声明:网站内容来源于网络,如有侵权,请联系我们https://www.qiquanji.com,我们将及时处理。
微信扫码关注
更新实时通知