第五节 jQuery操作样式名称 

 1 <!-- $('#div1').addClass('divClass2') 为id为div1的对象追加（不是替换）样式divClass2
 2      $('#div1').removeClass('divClass2') 移除divClass样式
 3      $('#div1').removeClass('divClass2 divClass2') 移除多个样式
 4      $('#div1').toggleClass('anotherClass') 重复切换anotherClass样式
 5      $('#div1').removeClass('divClass2') 判断是否存在divclass2，存在返回true -->
 6 <!DOCTYPE html>
 7 <html lang="en">
 8 <head>
 9     <meta charset="UTF-8">
10     <title>Document</title>
11     <script type="text/javascript" src="../jquery-1.12.4.min.js"></script>
12     <script type="text/javascript">
13         $(function(){
14             var $div = $('#div1');
15             $div.addClass('box');
16             $div.addClass('big');
17             $div.removeClass('box1');
18         });
19     </script>
20     <style type="text/css">
21         .box{
22             width: 300px;
23             background-color: gold;
24             height: 300px;
25         }
26 
27         .big{
28             font-size: 30px;
29         }
30 
31         .box1{
32             line-height: 300px;
33         }
34     </style>
35 </head>
36 <body>
37     <div id="div1" class="box1">这是一个div</div>
38 </body>
39 </html>

 

posted @ 2020-03-14 17:28  kog_maw  阅读(192)  评论(0)    收藏  举报