jQuery选择器

1.jQuery选择器概述

选择器是jQuery的基础，在jQuery中，对事件的处理、遍历DOM和Ajax操作都依赖于选择器。熟练的使用选择器能简化代码增加编程效率。

什么是jQuery选择器？
选择器的作用是获取元素，而后为其添加CSS样式，美化其外观；jQuery选择器获取元素后，为该元素添加的是行为，使页面交互变得更丰富多彩。

jQuery选择器的优势

1. 简洁的写法
2. 完善的处理机制

jQuery选择器的类型

• 通过CSS选择器选取元素
  1. 基本选择器
  2. 层次选择器
  3. 属性选择器
• 通过过滤选择器选取元素
  1. 基本过滤选择器
  2. 可见性过滤选择器

2.通过CSS选择器选取元素

基本选择器

名称	语法
标签选择器	p
类选择器	.class
id选择器	#id
并集选择器	.class,#id
全局选择器	*

层次选择器

名称	语法
后代选择器	div p
子选择器	div>p
相邻元素选择器	div+p
同辈元素选择器	div~p

属性选择器

语法	描述
input[type]	包含type属性的input元素
input[type=text]	包含type属性并且属性值等于text的input元素
input[type!=text]	包含type属性并且属性值不等于text的input元素
input[type^=t]	包含type属性并且属性值以t开头的input元素
input[type$=t]	包含type属性并且属性值以t结尾的input元素
input[type*=t]	包含type属性并且属性值包含t的input元素

3.通过条件过滤选取元素

基本过滤选择器

语法	描述
li:first	选取第一个li元素
li:last	选取最后一个li元素
li:not(:first)	选取除了第一个li以外的其他元素
li:even	选取索引是偶数的li元素(索引从0开始)
li:odd	选取索引是奇数的li元素(索引从0开始)
li:eq(0)	选取索引为0的li元素
li:gt(0)	选取索引大于0的li元素(索引从0开始，大于1，不包括1)
li:lt(0)	选取索引小于0的li元素(索引从0开始，小于1，不包括1)
:header	选取所有标题元素，如h1~h6
:focus	选取当前获得焦点的元素
:animated	选取所有动画元素

可见性过滤选择器

语法	描述
:visible	选取所有可见的元素
:hidden	选取所有隐藏的元素

4.jQuery选择器的注意事项

选择器中含有特殊符号的注意事项
在实际开发时可能会遇到表达式含有"#"，"."等特殊字符，解决方法是使用转义符转义。

转义前:
$("#id#a");
$("#id[2]");
转义后:
$("#id\\#a");
$("#id\\[2\\]");

选择器中含有空格的注意事项
选择器中的空格也是不容忽视的，多一个或少一个可能会得到不同的结果。

$(".txt :hidden");  //选择类样式为.txt的后代为隐藏的元素
$(".txt:hidden");   //选择类样式为.txt并且隐藏的元素