JQuery常用选择器

----------------- 1 基本选择器

  1.   #id 根据给定的id匹配一个元素 单个元素  

  2.  .class 根据给定的类名匹配元素 集合元素  

  3.  element 根据给定的元素名匹配元素 集合元素  

  4.  * 匹配所有元素  

  5   selector,selector2.....selectorN 将每一个选择器匹配到的元素      合并后一起返回  集合元素

   ------------------------- 2 层次选择器    

  1.  $("ancestor descendant") 选取ancesto元素里的所有descendant(后代)元素 返回集合元素 $("div span") 选取div里所有的span元素  

  2.  $("parent>child") 选取parent元素下的child(子)元素 不选择孙子元素                         $("div>span") 返回的是div元素下元素名是span的元素  

  3.  $('prev+next') 选取紧接在prev元素后的next元素 返回集合元素  

   4.  $('prev~siblings') 选取perv元素之后的所有siblings元素    $('prev+next')  可以用 $("prev").next(next) 替代    如  $('#div1+div')   $("#div1").next("div")  获取id为div1的元素的下一个div兄弟元素       $('perv~siblings') 可以用 $("#div1").nextAll("div") 获取id为div1的元素的后面的同      辈的所有的div元素   siblings方法与前后位置无关 只要是同辈元素都能匹配

 ---------------------- 过滤选择器

  基本过滤选择器  

   :first    $("div:first") 选取所有div元素中的第一个div元素  

   :last    $("div:last")  选取所有div元素中最后一个div元素  

   :not(selector) $("input:not(.myClass)") 选取所有类名不是myClass的input元素  

   :even   $("input:even") 选取所有事偶数的input元素  

   :odd     $("input:odd") 选取所有事奇数的input元素  

   :eq(index)  $("input:eq(1)") 选取索引是1的input元素  

   :gt(index)   选取索引大于index的元素  

   :lt(index)    选取索引小于index的元素  

   :header     选取网页中所有的h1 h2 h3......  

   :animated  选取正在执行动画的元素

   table默认下级有个tbod元素

   ----------------内容过滤器     

   :contains(text) 选取含有文本内容为"text"的元素 $("div:contains('我')")   

   :empty 选取不包含子元素或者文本的空元素   

   :has(selector) 选取含有选择器匹配的元素的元素  $("div:has(p)")选取含有p元素的div元素   

   :parent 选取含有子元素或者文本的元素 $("div:parent")选取拥有子元素或文本的div元素

可见性过滤选择器

   :hidden 选取所有不可见的元素   

   :visible  选取所有可见的元素      

   :hidden 它不仅包括样式属性display为none的元素 也包括文本隐藏域和visibility:hidden之类的元素

 

属性过滤选择器

   [attribute] 选取拥有此属性的元素 $("div[id]")选取拥有属性id的元素   

   [attribute=value] 选取属性的值为value的元素  $("div[title=test]") 选择属性为title为test的元素   

   [attribute !=value] 选取属性的值不为value的元素 $("div[title!=test]") 选取属性title不为test的元素 没有title属性的也会被选中   

   [attribute ^=value] 选取属性的值以value值开始的元素    [attribute $=value] 选取属性的值以value值结束的元素   

   [attribute *=value] 选取属性的值包含value值的元素   

   [selector1][selector2][selectorN] 用属性选择器合并成一个复合属性选择器 满足多个条件 每选择一次 缩小一次范围 $("div[id][title$=test]") 选取拥有id属性的并且属性的      title以test结尾的div元素   

   子元素过滤选择器

   :nth-child(index/even/oidd/equation) 选取每个父元素下的第index个子元素或者奇偶元素 index从1算起   

   :first-child 选取每个父元素的第一个子元素   

   :last-child 选取每个父元素的最后一个子元素   

   :only-child 如果某个元素是它父元素中唯一的子元素 那么将会被匹配 如果元素中含有其他元素 则不会被匹配     

   nth-child() 选组起是很常用的子元素过滤选择器 详细功能如下      

          1,  :nth-child(even) 选取每个父元素下的索引值是偶数的元素   

          2,  :nth-child(odd)  选取每个父元素下的索引值是奇数的元素   

          3,  :nth-child(2) 选取每个父元素下索引为2的子元素   

         4,  :nth-child(3n) 能选择每个父元素下的索引值是3的倍数的元素 n从0开始   

         5,  :nth-child(3n+1) 能选择每个父元素下的索引值是(3n+1)的元素 n从0开始  

----------------- 表单对象属性过滤选择器      

   :enabled   选取所有可用元素   

   :disabled   选取所有不可用元素   

   :checked   选取所有被选中的元素 单选框 复选框   

   :selected    选取所有被选中的选项元素 下拉列表

 ----------------- 表单选择器        

   :input  选取input textarea select button元素     

   :text     选取所有单行文本框     

   :password  选取所有密码框     

    :radio         选取所有单选按钮     

    :checkbox   选取所有多选框     

    :submit       选取所有提交按钮     

   :image        选取图像按钮     

    :reset          选取重置按钮     

    :button      选取所有按钮     

    :file            选取所有上传域     

    :hidden     选取所有不可见元素

 

posted @ 2012-03-13 16:00  王绚文  阅读(477)  评论(0编辑  收藏  举报