使用jQuery选择器
1、可以使代码更简洁的写
document.getElementById()使用jQuery的写：$("#demo")
2、支持CSS选择器
3、提供了完善的处理机制 （完善的兼容处理）
1、基本选择器
基本选择器是JQuery最常用的选择器，也是最简单的选择器，它通过元素id、class和标签名来查找DOM元素。
* : 选择所有元素 //$("*").css("background","red")
#id ：通过id属性值获取元素 //$("#id").css("background","red")
Element ：通过元素名获取元素
selector1,selector2 ：获取列表中指定的所有元素
.class ：获取使用class样式的所有元素、
2、层级选择器
如果想通过 DOM 元素之间的层次关系（后代元素, 子元素, 相邻元素, 兄弟元素等）来获取特定元素。
ancetor descendant ：匹配祖先元素下的后代元素 //$("body div").css("background","red")
parent > child ：匹配父元素下的子元素 //$("body>div").css("background","red")
prev + next ：匹配上一个元素的后面的元素，必须是挨着的
prev~siblings ：匹配前一个元素的所有平辈元素，在prev元素后面才能匹配 //$("#two").siblings("div").css("background","red")
3、过滤选择器
在页面元素中先找到许多具有共同属性的元素，然后对这些元素加过滤条件，找到我们想要的这些元素。
即通过特定的过滤规则来筛选出所需的 DOM 元素。
按照不同的过滤规则,又分为基本过滤选择器, 内容过滤选择器, 可见性过滤选择器, 属性过滤选择器, 子元素过滤选择器和表单对象属性过滤选择器。
3.1、基础过滤选择器
:first ：匹配第一个元素
:last ：匹配最后一个元素 //$("div:last")
:even ：匹配索引为偶数的元素 //$("input:even")
:odd ：匹配索引为奇数的元素
:eq(index) ：匹配索引为指定值的元素
:gt(index) ：匹配索引大于指定值的元素 //:gt(index)
:lt(index) ：匹配索引小于指定值的元素
:not(selector) ：匹配除了指定选择器之外的所有元素 //$("div:not(.class)").css("background","red")
3.2、内容过滤选择器
:contains(text) ：匹配内容中包含指定内容的元素
:empty ：匹配内容为空的元素
:has(selector) ：匹配内容中包含指定选择器的元素
:parent ：匹配内容不为空的元素
3.3、可见性过滤选择器
:hidden ：匹配隐藏的元素 //$("div:hidden").show(3000)
:visible ：匹配显示的元素
3.4、属性过滤选择器
[attribute] ：匹配具有指定属性的元素 //$("div[title]").css("background","red")
[attribute=value] ：匹配属性等于指定值的元素
[attribute!=value] ：匹配属性不等于指定值的元素
[attribute^=value] ：匹配属性值以指定值开始的元素 //("div[title^=en]").css("background","red")
[attribute$=value] ：匹配属性值以指定值结束的元素
[attribute*=value] ：匹配属性值中包含指定值的元素
[selector1][selector2][selectorN] ：同时满足所有条件，则匹配
3.5、子元素过滤选择器
:nth-child(index/even/odd) ：匹配指定索引的元素 从1算起 //$("div.one :nth-child(2)").css("background","red")
:first-child ：匹配第一个子元素
:last-child ：匹配最后一个子元素
:only-child ：如果子元素是父元素的唯一子元素，则匹配
3.6、表单对象属性滤选择器
:enabled ：匹配状态可用的表单元素
:disabled ：匹配状态不可用的表单元素
:checked ：匹配被选中的元素 匹配单选或复选 //$("#form1 input:checked").length
:selected ：匹配被选中的元素 匹配的是option
3.7、表单过滤选择器
:input ：匹配所有表单元素
$(“:input”) ：匹配所有表单元素 select、textarea
$(‘input’) ：匹配input标签
:text ：文本框
:password ：密码框 //$(":password")
:radio ：单选按钮
:checkbox ：复选框
:submit ：提交按钮
:reset ：重置按钮 //$(":reset")
:image ：图像按钮
:button ：按钮
:file ：文件框
:hidden ：隐藏域