jQuery选择器
jQuery选择器
一、基本分类
jQuery选择器大致可以分为两类，基本选择器和过滤选择器,总体结构体系如下:
二、基本选择器
2.1 CSS选择器
CSS选择器（链接：http://www.cnblogs.com/qinwang913/p/3443766.html）
2.1.1 标签选择器
2.1.2 ID选择器
2.1.3 类选择器
例： $(".t").css("border","2px solid blue");
2.1.4 通用选择器
2.1.5 群组选择器
格式：$("selector,selector2,......,selectorN")
例： $("div,span,p.styleClass").css("border","2px solid blue");
2.2 层级选择器
在HTML方档中，每个元素总是处在DOM节点树上的某个位置，文档层次结构中元素之间总是存在着某种层级关系。
2.2.1 子元素选择器
2.2.2 后代选择器
2.2.3 紧邻同辈选择器
2.2.4 相邻同辈选择器
例：$("input~p").css("color","red");
2.3 表单域选择器
表单域指网页中的input,textareaselect,button元素。jQuery 表单域选择器专门用于从文档中选择表单域。
2.3.1 :input选择器
用于选择所有input,textareaselect,button元素。
2.3.2 :text选择器
用于选择所有单行文本框(<input type="text"/>)。
2.3.3 :password选择器
用于选择所有密码框(<input type="password"/>)。
2.3.4 :radio选择器
用于选择所有单选按钮(<input type="radio"/>)。
2.3.5 :chckbox选择器
用于选择所有复选框(<input type="chckbox"/>)。
2.3.6 :file选择器
用于选择所有文件域(<input type="file"/>。
2.3.7 :image选择器
用于选择所有图像域(<input type="image"/>)。
2.3.8 :hidden选择器
用于选择所有不可见元素(<input type="hidden"/>)。
2.3.9 :button选择器
用于选择所有按钮(<input type="button"/>和<button>···</button>)。
2.3.10 :submit选择器
用于选择所有提交按钮(<input type="submit"/>和<button>···</button>)。
2.3.11 :reset选择器
用于选择所有重置按钮(<input type="reset"/>)。。
三、过滤选择器
过滤选择器可以使用元素的索引值，内容，属性，子元素位置，表单域属性以及可见性作为筛选条件获取相关元素。
3.1简单过滤选择器
根据索引值对元素进行筛选，类似于CSS的伪类选择器，以冒号（：）开头；并且要和另一选择器一起使用。
3.1.1 :first选择器
例： $("td:first").css("border","2px solid blue");
3.1.2 :last选择器
3.1.3 :odd选择器
3.1.4 :even选择器
3.1.5 :eq()选择器
格式：$(":selector:eq(index)),index 为指定元素在selector集合中的索引值（从0开始计数）
3.1.6 :gt()选择器
格式：$(":selector:gt(index)),index 为指定元素在selector集合中的索引值（从0开始计数），只有索引值大于此值的元素才会包含在查询结果中。
3.1.7 :lt()选择器
格式：$(":selector:lt(index)),index 为指定元素在selector集合中的索引值（从0开始计数），只有索引值小于此值的元素才会包含在查询结果中。
3.1.8 :not选择器
例：$("td:not(:first,:last)").css("background","#FCF")
3.1.9 :header选择器
3.1.10 :animated选择器
3.2内容过滤选择器
3.2.1:contains()选择器
格式：$("selector:contains(text)")
3.2.2: has()选择器
格式：$("selector1:has(selector2)"),selector1，selector2为任意有效的选择器。
3.2.3 :empty选择器
3.2.4 :parent选择器
用于选择包含子元素或者文本的所有空元素，与：empty选择器作用相反。
3.3简单过滤选择器
在HTML文档中，元素的开始标记中通常包含多个属性，根据各种属性对由选择器查询到的元素进行过滤。
语法格式：“选择器[属性过滤选择器]”，可根据是否包含指定属性或根据属性值从查询到的元素进行筛选。
3.3.1 包含属性选择器
3.3.2 属性等于选择器
格式：$("selector[attribute=value]")
例：$("input[name=accept]").attr("checked","true");
3.3.3 属性包含选择器
格式：$("selector[attribute*=value]")
例：$("input[name*='news']").val("name 中包含news 的元素");
3.3.4 属性包含单词选择器
格式：$("selector[attribute~=value]")
例：$("input[name~='news']").val("name 中包含news单词的元素");
3.3.5 属性不等于选择器
用于选择不包含给定属性，或者包含指定属性但该属性不等于某个值的所有元素。
格式：$("selector[attribute!=value]")
3.3.6 属性开始选择器
格式：$("selector[attribute^=value]")
3.3.7 属性结尾选择器
格式：$("selector[attribute$=value]")
3.3.8 复合属性选择器
格式：$("selector[selector1][selector2]....[selectorN]")
例：$("input[id][name^='news’]").val(“选择包含id属性且name属性以news开头的文本框”);
3.4子元素过滤选择器
子元素过滤选择器必须与某个选择器一起使用，得到一个父元素数组，然后再按照子元素过滤选择器指定的索引值或规则进一步筛选出部分子元素。
3.4.1 :first-child选择器
例：$("ul:first-child").css("text-decoration","underline");
3.4.2 :last-child选择器
3.4.3 :nth-child选择器
格式：$("selector:nth-child(index/even/odd/equation)")
3.4.4 :only-child选择器
3.5表单过滤选择器
3.5.1:checked选择器
选择器可指定要查找的元素类型，可以是input(单选按钮和复选框),:radio(单选按扭) :checkbox(复选框)
3.5.2:enabled选择器
3.5.3:disabled选择器
3.5.4:selected选择器
3.6可见性过滤选择器
如果某元素及其父元素在文档中占用空间，则认为该元素为可见；反之，则此元素不可见。
3.6.1:hidden选择器
3.6.1:visible选择器
四、总结
至此，关于CSS选择器和jQuery选择器的知识小结终于结束了，很释然，很快乐，给自己的知识作个整理，也将这些分享给每个需要的人，大家一起加油努力。
