过滤选择器

基本过滤选择器

1.:first 选取第一个元素

    $('tr:first')  返回第一个 tr 元素

2.:last  选取最后一个元素

    $('tr:last')  

3.:not(selector)  去除与给定选择器匹配的元素

    $('tr:not(".new")')    首先选择所有的 tr 元素,然后取出所有包含 class="new" 的 tr 元素

4.:even  选取索引值为偶数的元素

    $('tr:even')  返回索引值为偶数的所有 tr 元素

5.:odd  选取索引为奇数的元素

    $('tr:odd')  返回索引值为奇数的所有 tr 元素

6:eq(index)  选取索引值为特定值的元素

    $('tr:eq(0)')  返回索引值为 0 的tr 元素，与 $('tr:first')  效果相同

7.:gt(index)   选取索引值大于某个特定值的元素

    $('tr:gt(1)')   选取索引值大于 1 的所有 tr 元素

8.:lt(index) 选取索引值小于某个特定值的所有元素

    $('tr:lt(1)')  

9.:header  选择 <h1> ~ <h6> 标签

    $(':header')  返回文档中 <h1>  ~ <h6> 所有元素

10.:animated  选取执行的动画元素

11.:focus  选取当前获得焦点的元素

内容过滤选择器：

1.:contains(text) 选取包含某个特定文本的元素

    $('td:contains("日本")')

2.:empty 选择不包含任何子元素或者文本的空元素

    $(':empty')  返回空元素

     $(':empty').css({"width":"100px","height":"20px","background":"blue"})

3.:has(selector) 选取包含选择器所匹配的元素的元素

    $('tr:has("th")')   返回 包含 th 元素的 tr 元素

    $('tr:has("th")').parent().css('color','red')

4.:parent 选取包含子元素或者文本的元素

    $(':parent')  返回非空元素

可见性过滤选择器：

1.:hidden 选取隐藏的元素

    $('tr:hidden').css('display','table-row')

2.:visible  选取显示的元素

    $('tr:visible')

子过滤选择器：

1.:nth-child 选取每个特定位置的元素

    $('tr:nth-child(1)')  返回每个表格的第一个子元素

    $('tr:nth-child(3n)')  选取 3的整数倍的子元素  或者  3n+1

    注意：这是唯一一个从 1 开始计数

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

    $('table tr:first-child')  返回每一个 table 的第一个 tr

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

    $('table tr:last-child')  

4.:only-child 如果元素是其父元素的唯一子元素，该元素将被返回

    $('tr td:only-child')  返回具有唯一子元素的 td