1 <!-- jQuery选择器可以快速的选择元素,选择规则和css样式相同,使用length属性判断是否选择成功: 2 $(‘#myid‘) 选择ID为myid的网页元素 3 $(‘.myClass‘) 选择class为myClass的元素 4 $(‘li‘) 选择所有的li元素 5 $(‘#ul1 li span‘) 选择id为ul1元素下所有li下的span元素 6 $(‘input[name=first]‘) 选择name属性等于first的input元素 7 8 对选择集进行过滤 9 $(‘div‘).has(‘p‘); 选择包含p元素的div元素 10 $(‘div‘).not(‘.myClass‘); 选择class不等于myClass的div元素 11 $(‘div‘).filter(‘,myClass‘); 选择class等于myClass的div元素 12 $(‘div‘).eq(5); 选择第6个div元素,从0开始计数 13 14 选择集转移 15 $(‘div‘).prev(); 选择div元素前面紧挨着的同辈元素 16 $(‘div‘).prevAll(); 选择div元素之前的所有的同辈元素 17 $(‘div‘).next(); 选择div元素后面紧挨的同辈元素 18 $(‘div‘).nextAll(); 选择div元素后面的所有同辈元素 19 $(‘div‘).parent(); 选择div的父元素 20 $(‘div‘).children(); 选择div的所有子元素 21 $(‘div‘).siblings(); 选择div的同级元素 22 $(‘div‘).find(‘.myClass‘); 选择div你的从class等于myClass的元素 23 24 判断是否选择到了元素:jQuery有容错机制,即使没有找到元素也不会出错,可以用length属性来判断是否找到了元素,length等于0就是没有找到元素,大于0就是找到了元素 25 --> 26 <!DOCTYPE html> 27 <html lang="en"> 28 <head> 29 <meta charset="UTF-8"> 30 <title>Document</title> 31 <script type="text/javascript" src="../jquery-1.12.2.js"></script> 32 <script type="text/javascript"> 33 $(function(){ 34 var $div = $(‘#div1‘); 35 $div.css({‘color‘:‘red‘}); 36 37 var $div2 = $(‘.box‘); 38 $div2.css({‘backgroundColor‘:‘gold‘,‘color‘:‘red‘}); 39 40 var $li = $(‘.list li‘); 41 $li.css({‘color‘:‘green‘}); 42 43 alert($li.length); 44 45 }); 46 </script> 47 </head> 48 <body> 49 <div id="div1">这是第一个div元素</div> 50 <div class="box">这是第二个div元素</div> 51 <div class="box">这是第三个div元素</div> 52 <!-- ul.list>li{$}*8 $自动编号 --> 53 <ul class="list"> 54 <li>1</li> 55 <li>2</li> 56 <li>3</li> 57 <li>4</li> 58 <li>5</li> 59 <li>6</li> 60 <li>7</li> 61 <li>8</li> 62 </ul> 63 64 </body> 65 </html>
原文:https://www.cnblogs.com/kogmaw/p/12493119.html