选择器是 Jquery 的基础，在 Jquery 中，对事件的处理、DOM 操作、Ajax 操作都是依赖选择器。
1. Jquery 环境配置
- jquery 库文件 jquery-3.2.1.min.js 放于应用中
- 在页面中使用 script 标签引入
图片.png
-
编写一个简单 Jquery 代码
图片.png
2. 选择器分类
2.1 基本选择器
- 基础选择器
- id 选择器
语法：$("#id值") eg: $("#id"),返回的是单个元素对象 - 元素选择器
语法:$("标签名称"); eg:$("div");返回的是集合 - 类选择器
语法:$(".class值");eg:$(".class指")；返回的是集合 - 通配选择器
语法:$("*");返回的是整个整个元素 - 群组选择器
语法:$("选择器的值1,选择器值2,......");eg:$(".c1,p"),返回的是集合
- id 选择器
2.2 层次选择器
- 子类选择器
语法：$(选择器 选择器); eg:$("form input"):找form标签中的input子类元素 - 儿子选择器
语法:$("选择器 > 选择器"); eg:$("form>input"):找form标签中的input儿子元素
-next元素选择器
语法：$(选择器 + 选择器):eg:$("label+input"):找label下一个input元素，有可以能返回多个
-同辈选择器
语法：$(选择器选择器);eg：$("forminput")，找form同辈(弟弟)的所有input元素
2.3 过滤选择器
- 基础过滤 自己看
- 查找第一个元素
语法：$(选择器::first);eg:$(ul li:first). - 排除过滤选择器
语法：$("选择器:not(选择器)")；eg :$("li:not(ul li:first)")
- 查找第一个元素
- 子元素过滤
- 内容过滤
- 属性选择器 自己看
- 带有属性的过滤
语法：$("选择器[属性名]") eg: $("div[lang]") - 带有属性的内容的过滤
语法：$("div[属性='值']") eg:$("div[lang='d2']")
- 带有属性的过滤
