首页 > 代码库 > jQuery 过滤选择器

jQuery 过滤选择器

一、基本过滤器

:first       $(‘li:first‘)     选取第一个元素 

:last            $(‘li:last‘)        选取最后一个元素

:not(selector)   $(‘li:not(.red)‘)     选取class不是red的li元素

:even    $(‘li:even‘)      选择索引(0开始)是偶数的所有元素

:odd      $(‘li:odd‘)    选择索引(0开始)是奇数的所有元素

:eq(index)   $(‘li:eq(2)‘)    选择索引(0开始)等于index的元素

:gt(index)    $(‘li:gt(2)‘)    选择索引(0开始)大于index的元素

:lt(index)     $(‘li:lt(2)‘)      选择索引(0开始)小于index的元素

:header    $(‘:header‘)   选择标题元素,h1~h6

:animated   $(‘:animated‘)     选择正在执行动画的元素

:focus       $(‘:foucus‘)   选择当前被焦点的元素

注意:focus过滤器,必须是页面初始状态的已经被激活的元素才能实现元素获取

jQuery为常用过滤器提供专用方法,来提高性能和效率

eq() first() last() not()

 

二、内容过滤器

:contains(text)  $(‘:contains(‘text‘)‘)  选取含有‘text’文本内容

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

:has(selector)  $(‘:has(.red)‘)      选取含有class是red的选择器

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

has()方法提高性能

parent()              当前元素的父元素

parents()       当前元素的父元素以及祖先元素

parentsUntil(‘div‘)    当前元素遇到div父元素停止

 

三、可见性选择器

:hiden    $(‘:hiden‘)   选取所有不可见元素

:visible   $(‘:visible‘)  选取所有可见元素

 

四、子元素选择器  

:first-child           $(‘li:first-child‘)      获取每个父元素的第一个元素

:last-child           $(‘li:last-child‘)    获取每个父元素的最后一个元素

:only-child             $(‘li:only-child‘)   获取只有一个子元素的元素 

:nth-child(odd/even/eq(index))     $(‘li:nth-child(even)‘)  获取每个自定义子元素的元素

jQuery 过滤选择器