选择器比较详细.docxVIP

1. 基础选择器?Basics名称说明举例#id根据元素Id选择$(#divId) 选择ID为divId的元素element根据元素的名称选择,$(a) 选择所有a元素.class根据元素的css类选择$(.bgRed) 选择所用CSS类为bgRed的元素*选择所有元素$(*)选择页面所有元素selector1,?selector2,?selectorN可以将几个选择器用,分隔开然后再拼成一个选择器字符串.会同时选中这几个选择器匹配的内容.$(#divId, a, .bgRed)2.层次选择器?Hierarchy名称说明举例ancestor descendant使用form input的形式选中form中的所有input元素.即ancestor(祖先)为from, descendant(子孙)为input.$(.bgRed div) 选择CSS类为bgRed的元素中的所有div元素.parent child选择parent的直接子节点child.? child必须包含在parent中并且父类是parent元素.$(.myListli) 选择CSS类为myList元素中的直接子节点li对象.prev + nextprev和next是两个同级别的元素. 选中在prev元素后面的next元素.$(#hibiscus+img)选在id为hibiscus元素后面的img对象.prev ~ siblings?选择prev后面的根据siblings过滤的元素?注:siblings是过滤器$(#someDiv~[title])选择id为someDiv的对象后面所有带有title属性的元素3.基本过滤器?Basic Filters名称说明举例:first匹配找到的第一个元素查找表格的第一行:$(tr:first):last匹配找到的最后一个元素查找表格的最后一行:$(tr:last):not(selector)去除所有与给定选择器匹配的元素查找所有未选中的 input 元素: $(input:not(:checked)):even匹配所有索引值为偶数的元素，从 0 开始计数查找表格的1、3、5...行:$(tr:even):odd匹配所有索引值为奇数的元素，从 0 开始计数查找表格的2、4、6行:$(tr:odd):eq(index)匹配一个给定索引值的元素?注:index从 0 开始计数查找第二行:$(tr:eq(1)):gt(index)匹配所有大于给定索引值的元素?注:index从 0 开始计数查找第二第三行，即索引值是1和2，也就是比0大:$(tr:gt(0)):lt(index)选择结果集中索引小于 N 的 elements?注:index从 0 开始计数查找第一第二行，即索引值是0和1，也就是比2小:$(tr:lt(2)):header选择所有h1,h2,h3一类的header标签.给页面内所有标题加上背景色: $(:header).css(background, #EEE);:animated匹配所有正在执行动画效果的元素只有对不在执行动画效果的元素执行一个动画特效: $(#run).click(function(){? $(div:not(:animated)).animate({ left: +=20 }, 1000);?});4. 内容过滤器 Content Filters名称说明举例:contains(text)匹配包含给定文本的元素查找所有包含 John 的 div 元素:$(div:contains(John)):empty匹配所有不包含子元素或者文本的空元素查找所有不包含子元素或者文本的空元素:$(td:empty):has(selector)匹配含有选择器所匹配的元素的元素给所有包含 p 元素的 div 元素添加一个 text 类: $(div:has(p)).addClass(test);:parent匹配含有子元素或者文本的元素查找所有含有子元素或者文本的 td 元素:$(td:parent)?5.可见性过滤器?Visibility Filters名称说明举例:hidden匹配所有的不可见元素注:在1.3.2版本中, hidden匹配自身或者父类在文档中不占用空间的元素.如果使用CSS visibility属性让其不显示但是占位,则不输入hidden.查找所有不可见的 tr 元素:$(tr:hidden):visible匹配所有的可见元素查找所有可见的 tr 元素:$(tr:visible)6.属性过滤器?Attribute Filters名称说明举例[attribute]匹配包含给定属性的元素查找所有含有 id 属性的 div 元素:?$(div[id])[attribute=value]匹配给定的属性是某