Zhang_limon
Zhang_limon

Jquery选择器总结

                    jQuery选择器问题

分类：

    1.基本选择器：

id class label

  example:$('#p')   匹配 id=p元素

        $('.p')    匹配 class=p元素

     $('p')     匹配

元素

     $('p,.p')  同时匹配

和class=p元素

    2.层次选择器：

       后代  子元素  相邻元素  同辈元

       example:$('div p')匹配

里的所有

元素

$('div > span') 匹配

元素下的元素

$('.one + div') 匹配 class=one的下一个

元素 可用$('.one').next("div")代替

$('#two~div')  匹配 id=two元素下所有

元素  可用$('#two').nextAll("div")代替

    3.过滤选择器：

3.1.基本过滤选择器：

         example:$('div:first')    匹配 所有

中第一个

        $('div:last')     匹配 所有

中最后一个

      $('input:not(.p)')匹配 所有class不是p的元素

    $('input:even')   匹配 所有索引为偶数的

    $('input:odd')    匹配 所有索引为奇数的   

    $('input:eq(1)')  匹配 索引等于1的

    $('input:gt(1)')  匹配 索引大于1的

    $('input:lt(1)')  匹配 索引小于1的

    $(':header')      匹配 网页中所有

,

....

    $('div:animated') 匹配 正在执行动画的

    $(':focus')       匹配 当前获取焦点的元素

3.2.内容过滤器：

example:$("div:contains('me')") 匹配 含有文本me的

    $('div:empty')          匹配 无子元素的空

    $('div:has(p)')         匹配 含有

原色的

    $('div:parent') 匹配 含有子元素或者文本的

3.3.可见性过滤器:

example:$(':hidden')      匹配 所有不可见元素

   $(':visible')     匹配 所有可见元素

3.4.属性过滤器:

example:$('div[id]')        匹配 拥有属性id的div

   $('div[id="test"]') 匹配 id属性=test的div

    $('div[id!="test"]')匹配 id属性!=test的div

    $('div[id^="test"]')匹配 id属性以test开头的div

    $('div[id$="test"]')匹配 id属性以test结尾的div

    $('div[id*="test"]')匹配 id属性值含有test的div

    $('div[id|="test"]) 匹配 id属性等于test或者以"test-"开头的div

$('div[id~="test"]) 匹配 id属性以空格分隔的值中含有test的元素

$('div[id][title$="test"]')匹配 有id属性且title属性以test结尾的div

3.5.子元素过滤器:

example:$(':nth-child')   匹配 每个父元素下的第n个元素

    $(':first-child') 匹配 每个父元素下的第一个元素

    $(':last-child')  匹配 每个父元素下的最后一个元素

    $(':only-child')  匹配 该元素仅仅是其父元素的唯一子元素

3.6.表单对象属性过滤器:

example:$(':enabled')  匹配 所有可用元素

   $(':disabled') 匹配 所有不可用元素

   $(':checked')  匹配 所有被选取的单选复选元素

   $(':selected') 匹配 所有被选取的下拉菜单选项

    4.表单选择器：

example:$(':input')    匹配 所有,