回顾下jQuery常用的选择器

jQuery常用的选择器有很多，过段时间不使用，有时候可能会忘记，所以需要经常去复习下咯，一起来回顾下吧。

层次选择器：

$('div p');//选取div下的所有的p元素

$('div>p').css('border','1px solid red');//只选取div下的直接子元素

//相邻的元素

$('div ~ p).css('border','1px solid red');与$('div').nextAll('p')等价;//表示div后面的

所有p兄弟元素

$('div ~ *').css('border','1px solid red');//表示div后面的所有兄弟元素

$('div +p').css('border','1px solid red');与$('div').next('p')等价//这种写法表示div后

只找紧挨着的第一个兄弟元素，并且该元素是p。

获得兄弟元素的方法：

next(); //当前元素之后的紧邻着的第一个兄弟元素（下一个）

nextAll();//当前元素之后的所有兄弟元素

prev();//当前元素之前的紧邻着的兄弟元素（上一个）

prevAll();//当前元素之前的所有兄弟元素

siblings();//当前元素的所有兄弟元素

基本过滤选择器：

$('p:first')与$('p').first()是等价的。获取所有p元素中的第一个P元素

$('p:last')与$('p').last()

$('p:eq(2)')在所有的p元素中找到索引为2的元素

$('p:even')选取所有奇数的p标签

$('p:odd')选取所有偶数的p标签

$('p:not(.tst)').css();选取所有的不应用.tst这种样式的p元素not后面写一个选择器名称

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

$('p:lt(3)')选取所有索引值小于3的p元素。

$(':header')选取页面上所有的h1-h6的元素。（如果这样写的话，中间绝对不能有空格。）

属性过滤选择器：

$("div[id]")选取有id属性的<div>

$("div[title=test]")选取title属性为“test”的<div>，jQuery中没有对getElementsByName

进行封装，用$("input[name=abc]")

$("div[title!=test]")选取title属性不为“test”的<div>

还可以选择开头【name^=值】、结束【 name$=值】、包含【 name*=值】等，条件还

可以复合。【[属性1=a][属性2=b]…】（*）

表单对象属性选择器（过滤器）：

$("#form1 :enabled")选取id为form1的表单内所有启用的元素

$("#form1 :disabled")选取id为form1的表单内所有禁用的元素

$(“input:checked”)选取所有选中的元素（Radio、CheckBox）,这个中间不能加空格.

$("select :selected")选取所有选中的选项元素（下拉列表）

表单滤选择器：

$('#form1:enabled');//这个表示能够启用的且id为form1的标签

$('#form1 :enabled')；//这个表示能够启用的且id为form1下的所有启用的元素。

$('input:checked')

$('input:disabled')

$ ('select:selected')

$(“:input")选取所有<input>、<textarea>、<select>和<button>元素。和$("input")不一样，

$("input")只获得<input>

$(":text")选取所有单行文本框，等价于

$("input[type=text]"),$(‘input[type=text]'),$(‘:text');

$(“:password”)选取所有密码框。

内容过滤选择器：

:contains(text):过滤出包含给定文本的元素。

：empty包含没有子元素的或者是内容为空的元素。

：has(selecttor)

:parent 获得有子元素的元素。

可见性过滤器：

:hidden

选取所有不可见元素包括:(如果直接写:hidden则会包含head\title\script\style….)

1.表单元素type=“hidden”

2.设置css的display:none

3.高度和宽度明确设置为0的元素。

4.父元素时隐藏的，所以子元素也是隐藏的

visibility: hidden 与opacity为0不算，因为还占位所以不认为是hidden.

:visible

选取所有可见元素

子元素过滤选择器：

first-child 与first的区别：first只能选取第一个，而first-child,则能选取每个子元素的第一个元素。

only-child:匹配当前父元素中只有一个子元素的元素。

nth-child:对比eq()来理解，eq()值匹配一个，nth-child()为每个父元素都要匹配一个子元素。

nth-child(index),index从1开始

nth-child(even)

nth-child(odd)

nth-child(3n),选取3的倍数的元素

nth-child(3n+1)满足3的倍数+1的元素

注意：

1.通过jQuery选择器选择的对象本身就是一个jQuery对象，选择器具有隐式迭代 的作用，例如：

$('p').click(function(){
    alert(this.innerText);
});

是为所有的p都注释了click事件。

2.无论选择器选择了几个元素返回的一个元素都是一个集合对象，如果没有找到相应的元素，则这个集合对象的length值为0，如果选择到了元素，这个length的元素就是选择的元素的索引值。所以也根据这个属性来判断元素是否存在。例如：

Iif($('#div').length>0)//判断元素是否存在

3.在事件中this还是表示当前触发事件的元素的对象，但是这里的this是dom对象而不是jQuery对象。如果需要执行jQuery中的方法或属性时，应该把this转换为jQuery对象

转换方式为：$(this);