jQuery选择器小结

<div class="iteye-blog-content-contain" style="font-size: 14px"> 
1.选择器 
1.id选择器： 
//选择 id为 one 的元素 
      $('#one') 

2.类选择器： 
//选择 class 为 mini 的所有元素 
$('.mini') 

3.标签选择器 
//选择 元素名是 div 的所有元素 
$('div') 

4.选择所有元素 
$('*') 

5.多选择器 
//选择 所有的span元素和id为two的div元素 
$('span,#two') 

2.层次选择器 
1.//选择 body内的所有div元素. 
    $('body div') 

2.//在body内的选择 元素名是div 的子元素. 
$('body > div') 

3. //选择 所有class为one 的下一个div元素. 
$('.one + div') 

4.//选择 id为two的元素后面的所有div兄弟元素. 
$('#two ~ div') 


3.过滤选择器 
1. //选择第一个div元素. 
     $('div:first') 

2.//选择最后一个div元素. 
$('div:last') 

3.//选择class不为one的 所有div元素. 
$('div:not(.one)') 

4. //选择 索引值为偶数 的div元素。 
$('div:even') 

5.  //选择 索引值为奇数 的div元素。 
$('div:odd') 

6. //选择 索引等于 3 的div元素 
$('div:eq(3)') 

7. //选择 索引大于 3 的div元素 
$('div:gt(3)') 

8. //选择 索引小于 3 的div元素 
$('div:lt(3)') 

9. //选择 所有的标题元素.比如h1, h2, h3等等... 
$(':header') 

10.//选择 当前正在执行动画的所有元素. 
$(':animated') 


4.内容过滤选择器 
1.//选取含有文本"di"的div元素. 
$('div:contains(di)') 

2.//选取不包含子元素(或者文本元素)的div空元素. 
$('div:empty') 

3. //选取含有class为mini元素 的div元素. 
$('div:has(.mini)') 

4.//选取含有子元素(或者文本元素)的div元素. 
$('div:parent') 

5.可见性过滤选择器 
1.//选取所有不可见的元素.包括<input type="hidden"/>. 
$('div:hidden') 

2.//选取所有可见的元素. 
$('div:visible') 


6.属性选择器 
1.//选取含有 属性title 的div元素. 
$('div[title]') 

2.//选取 属性title值等于 test 的div元素. 
$('div[title=test]') 

3.//选取 属性title值不等于 test 的div元素. 
$('div[title!=test]') 

4.//选取 属性title值 以 te 开始 的div元素. 
$('div[title^=te]') 

5.//选取 属性title值 以 est 结束 的div元素. 
$("div[title$=est]") 

6.//选取 属性title值 含有 es  的div元素. 
         $("div[title*=es]") 
  
7.//组合属性选择器,首先选取有属性id的div元素，然后在结果中 选取属性title值 含有 es 的元素. 
$("div[id][title*=es]") 

7.子元素过滤选择器 
1.//选取每个父元素下的第2个子元素 
     $('div.one :nth-child(2)') 
  
2//选取每个父元素下的第一个子元素 
$('div.one :first-child') 

3.//选取每个父元素下的最后一个子元素 
$('div.one :last-child') 

4.//如果父元素下的仅仅只有一个子元素，那么选中这个子元素 
$('div.one nly-child') 

8.表单对象过滤选择器 
1.//重置表单元素 
$(":reset") 

  
2.//对表单内 可用input 赋值操作. 
$("#form1 input:enabled") 

3.//对表单内 不可用input 赋值操作. 
$("#form1 input:disabled") 

4.//使用:checked选择器，来操作多选框. 
$(":checkbox") 

5.//使用:selected选择器，来操作下拉列表. 
$("select :selected") 


9.表单选择器 
  var $alltext = $("#form1 :text"); 
      var $allpassword= $("#form1 :password"); 
          var $allradio= $("#form1 :radio"); 
          var $allcheckbox= $("#form1 :checkbox"); 

  var $allsubmit= $("#form1 :submit"); 
  var $allimage= $("#form1 :image"); 
  var $allreset= $("#form1 :reset"); 
  var $allbutton= $("#form1 :button"); // <input type=button />  和 <button ></button>都可以匹配 
  var $allfile= $("#form1 :file"); 
          var $allhidden= $("#form1 :hidden"); // <input type="hidden" />和<div style="display:none">test</div>都可以匹配. 
          var $allselect = $("#form1 select"); 
          var $alltextarea = $("#form1 textarea"); 
    
  var $AllInputs = $("#form1 :input"); 
  var $inputs = $("#form1 input"); 

</div>