jQuery选择器学习总结

基本选择器：

$("#test")获取id为test的元素 
$(".test")获取class为test的元素
$("*")获取所有元素
$("div,span,P.myClass")选取所有<div><span>和class为myClass的元素
 例：$("#test").css("backgroundColor","red");改变id为test元素的背景色
 $("span,#test").class("backgroundColor","blue");该变<span>和id为test元素的背景色

 

层次选择器：

$("body div")获取body中的所有<div>元素 
$("div>span")选取<div>元素下是<span>的元素
$(".test+next")选取class为"test"的下一个<div>元素
$("#test~siblings")选取id为"test"元素后面的兄弟元素,即同级元素

过滤选择器：都以" : "开头

//注：以下所列都是一些常用的,所列属性并不齐全
基本过滤选择器：
$("div:first")选取所有<div>元素中的第一个<div>元素，"last"表示最后一个
$("input:not(.myClass)")选取class不是myclass的<input>元素
$("input:even")选取索引是偶数的<input>元素，"odd"表示奇数
$("input:eq(index)")选取索引等于index的<input>元素
   :gt(index)表示大于index的元素
   :lt(index)表示小于index的元素

内容过滤选择：
:contains(text)选取文本内容含有"text"的元素
例：$("div:contains('小王')")选取含有文本"小王"的<div>元素

可见性过滤选择器：
//:hidden表示隐藏,不可见  :visible表示可见的  
$("input:hidden")选取所有不可见的<input>元素
$("div:visible")选取可见的<div>元素

属性过滤选择器：
$("div[title=test]")选取属性title为"test"的<div>元素

子元素过滤选择器：
:nth-child(index)选取父元素下从index开始的元素，index是从1开始计算，而:eq(index)是从0开始计算的
:first-chile(index)选取每个父元素下的第一个子元素。例：
$("ul li:first-child")选取每个<ul>中的第一个<li>元素
同理:last-child表示最后一个。

表单属性过滤选择器：
$("#form:enabled")选取form表单内的可用元素，disabled:表示不可用
$("input:checked")选取所有被选中的<input>元素
$("select:selected")用于下拉列表中被选中的元素

表单选择器：

$(":text")选取所有的文本
$(":checkbox")选取所有的复选框
$(":file")选取所有的上传域