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/