jquery已经被大多数前端开发人员熟悉了，但是能够不查资料而熟练应用的却是不多。所以在结合最近项目中的应用，我觉得是时候总结下了。首先总结下jquery的选择器这个强大无比的功能。

• 基本选择器：

  （1）标签选择器：$("div") 选择所有的div元素，返回数组。

  （2）id选择器：$("#id1") 选择id为id1的元素，返回单一元素。

  （3）类选择器：$(".class1") 选择class为class1的所有元素，返回数组。

  （4）("*") 选择文档中所有的元素，返回数组。

• 层叠选择器

  （1）$("ul li") 选择所有ul 下的li元素，返回数组。

  （2）$(".class2 span") 选择所有class为class1的span元素，返回数组。

  （3）$("label + input") 选择紧跟着lable元素后的input元素，返回数组。

  （4）$("#prev ~ div") 选择id为prev元素的兄弟元素div，返回数组。

  （5）$("#div1 > input") 选择id为div1元素中第一级input。

• 基本过滤选择器

  （1）$("li:first") 选择所有li元素的第一个，返回单一元素。

  （2）$("li:first") 选择所有li元素的最后一个，返回单一元素。

  （3）$("input:not(:checked) + span") 过滤掉checked选择器后面的span元素。

  （4）$("tr:even") 选择索引为偶数的tr，返回数组（0,2,4,6，....）。

  （5）$("tr:odd") 选择索引为奇数的tr，返回数组（1,3,5，....）。

  （6）$("tr:eq(2)") 选择所有索引为2的tr，返回数组。

  （7）$("tr:gt(2)") 选择所有索引大于2的tr，返回数组。

  （8）$("tr:lt(2)") 选择所有索引为2的tr，返回数组。

• 表单元素选择器

  （1）$(":input") 选择所有的input表单元素，包括input，textarea,select,button

  （2）$(":text") 选择所有的text  input表单元素。

  （3）$(":password") 选择所有的password  input表单元素。

  （4）$(":radio") 选择所有的radio input表单元素。

  （3）$(":checkbox") 选择所有的checkbox input表单元素。

  （3）$(":submit") 选择所有的submit input表单元素。

  （3）$(":button") 选择所有的button input表单元素。

  （3）$(":file") 选择所有的file input表单元素。

  （3）$(":hidden") 选择所有的hidden input表单元素。

  （3）$(":image") 选择所有的image input表单元素。

• 表单元素过滤选择器：

  $(

  ":enabled"

  )             选择所有的可操作的表单元素

  $(":disabled")            选择所有的不可操作的表单元素

  $(":checked")            选择所有的被checked的表单元素

  $("select option:selected") 选择所有的select 的子元素中被selected的元素。

• 内容过滤选择器：

  （1）$("div:contains('John')")  选择所有div中含有John文本的元素

  （2）$("div:has(p)")         选择所有含有p标签的div元素

  （3）$("td:empty")            选择所有的为空（也不包括文本节点）的td元素的数组

  （4）$("td:parent")           选择所有的以td为父节点的元素数组

• 可视化过滤选择器：

  （1）$("div:hidden")         选择所有的被hidden的div元素。

  （2）$("div:visible")         选择所有的可视化的div元素。

• 属性过滤选择器：

  （1）$("div[id]")               选择所有含有id属性的div元素

  （2）$("input[name='newsletter']")   选择所有的name属性等于'newsletter'的input元素

  （3）$("input[name!='newsletter']")  选择所有的name属性不等于'newsletter'的input元素

  （4）$("input[name^='news']")        选择所有的name属性以'news'开头的input元素

（5）$("input[name$='news']")        选择所有的name属性以'news'结尾的input元素

（6）$("input[name*='man']")         选择所有的name属性包含'news'的input元素

（7）$("input[id][name$='man']")   可以使用多个属性进行联合选择，该选择器是得到所有的含有id属性并且那么属性以man结尾的元素

子元素过滤选择器：

（1）$("ul li:nth-child(2)"),$("ul li:nth-child(odd)"),$("ul li:nth-child(3n + 1)")

（2）$("div span:first-child")   返回所有的div元素的第一个子节点的数组

（3）$("div span:last-child")     返回所有的div元素的最后一个节点的数组

（4）$("div button:only-child")   返回所有的div中只有唯一一个子节点的所有子节点的数组