后代选择器和过滤选择器不同
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title> new document </title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 6 <!-- 引入jQuery --> 7 <script src="http://www.cnblogs.com/scripts/jquery-1.3.1.js" type="text/javascript"></script> 8 <script type="text/javascript"> 9 $(function(){ 10 //注意区分类似这样的选择器 11 //虽然一个空格，却截然不同的效果. 12 var $t_a = $('.test :hidden'); //后代选择器 13 var $t_b = $('.test:hidden'); //过滤选择器 14 var len_a = $t_a.length; 15 var len_b = $t_b.length; 16 alert("$('.test :hidden') = " + len_a); //输出 4 17 alert("$('.test:hidden') = " + len_b); //输出 3 18 }) 19 </script> 20 </head> 21 <body> 22 <div class="test"> 23 <div style="display:none;">aa</div> 24 <div style="display:none;">bb</div> 25 <div style="display:none;">cc</div> 26 <div class="test" style="display:none;">dd</div> 27 </div> 28 <div class="test" style="display:none;">ee</div> 29 <div class="test" style="display:none;">ff</div> 30 </body> 31 </html>