<jQuery> <选择器> 三. 基本选择器 

 1 <!DOCTYPE html>
 2 <html lang="cn">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <style>
 8     div {
 9         height: 200px;
10     }
11 </style>
12 <body>
13 <ul>
14     <li id="first">0</li>
15     <li class="red">0</li>
16     <li class="red">0</li>
17     <li id="four">0</li>
18     <li class="orange">0</li>
19     <li class="pink">0</li>
20 </ul>
21 <div></div>
22 &nbsp;
23 <div></div>
24 </body>
25 
26 <script src="jquery-2.1.1.min.js"></script>
27 <script>
28     // id选择器
29     $("#first").css("backgroundColor", "blue");
30 
31     // 类选择器
32     $(".red").css("backgroundColor", "red");
33 
34     // 标签选择器
35     $("div").css("backgroundColor", "yellow");
36 
37     // 并集选择器
38     $("#four, .orange").css("backgroundColor", "orange");
39 
40     // 交集选择器
41     $("li.pink").css("backgroundColor", "pink");
42 </script>
43 </html>

 

posted @ 2017-12-15 16:57  云淡风轻我爱编程  阅读(244)  评论(0)    收藏  举报