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)')  获取每个自定义子元素的元素(索引值从1开始计算)

五、其他方法

is(s/o/e/f)            $('li').is('.red')        传递选择器、DOM、jQuery对象或者函数来匹配元素结合 检测class是否为red

hasClass(class)  $('li').eq(2).hasClass('red')  就是is("."+class)

slice(start,end)    $('li').slice(0,2)              从start到end之间的元素,如果是负数,就从后面开始

filter(s/o/e/f)         $('li').filter('.red')                可以将其他选择器综合使用

end()     $('div').find('p').end()      获取当前元素前一次状态

contents()     $('div').contents()      获取某个元素下面所有的元素节点,包括文本节点,如果是iframe,则可以查找文本内容

 

posted @ 2017-07-03 19:07  IceSnova  阅读(268)  评论(0编辑  收藏  举报