Jquery那些事

Jquery选择器介绍:

  我们可以通过Jquery选择器从网页文档中找到我们需要的DOM节点;

主要还时看文档!!

(1)基本选择器

属性id    类别class       文档标签

(2)属性选择器

(3)其他选择器

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset="UTF-8">
 5 <title>Insert title here</title>
 6 <script type="text/javascript" src="../js/jquery-1.11.0.js"></script>
 7 <style type="text/css">
 8     .c1{
 9         font-size:40px;
10     }
11     .c2{
12         font-size:20px;
13     }
14 </style>
15 </head>
16 <script type="text/javascript">
17     $(document).ready(function(){
18         //基本选择器
19         //$("#a1").css("background-color","red");//对id直接搞起来
20         //$(".c1").css("background-color","red");//根据类别class
21         //$("a").css("background-color","yellow");//根据标签元素
22         //属性选择器
23         //$("[href]").css("background-color","green");
24         //$("[href='#']").css("background-color","yellow");
25         //$("[href$='com']").css("background-color","red");
26         //其他选择器
27         //$("p.c1").css("background-color","red");
28         //$("ul li:first").css("background-color","green");
29         $("ul li:last").css("background-color","orange");
30     });
31     
32 </script>
33 <body>
34 <p class="c1">Jquery选择器 </p>
35     <ul>
36         <li id="i1"><a id="a1" class="c2" href="http://www.java1234.com" target="_blank">java知识分享网</a></li>
37         <li><a id="a2" class="c2" href="htp://www.baidu.com" target="_blank">百度</a></li>
38         <li><a href="http://www.iteye.com" id="c2" target="_blank">iteye</a></li>
39         <li><a class="c2" href="#" target="_blank">哈哈</a></li>
40         <li><a href="http://www.google.com" id="c2" target="_blank">谷歌</a></li>
41         <li><a class="c1" href="#" target="_blank">哈哈333</a></li>
42     </ul>
43 </body>
44 </html>

文档连接:

中文版:http://jquery.cuishifeng.cn/

官方英文文档:https://api.jquery.com/

原文地址:https://www.cnblogs.com/zyxsblogs/p/10071530.html