一、jQuery简介
-
jQuery是一个高效、精简、并且功能丰富的JS工具库
1.1 版本发展
-
① 1.x：兼容 IE6 / 7 / 8，士工作中最长使用的，学习1.12版本
-
② 2.x：兼容IE 6 / 7 / 8，多用于jQuery 官方调整bug使用。工作中不使用。
-
③ 3.X：不兼容IE 6 / 7 / 8，只能在高版本浏览器中使用，是现在 jQuery官方主要的维护升级的版本。
1.2 下载与参考
-
http:/ / jquery.com/download/
-
https : //www.bootcdn. cn/jquery/
二、jQuery体验
-
jQuery确实极大的简化了 DOM 操作，让编程变得 更加简单高效。
2.1 jQuery常见操作
-
$() 方法
-
在DOM操作中，基本都是从获取元素开始的
-
在 jQuery 中，只有一个全局变量$.这是 jQuery 的一大特点，避免了全局变量的污染。
-
最开始变量不叫做$，叫做jQuery()方法，在库中两个名字是并存的，都可以使用。
-
经典错误：$未定义
2.2 jQuery对象
-
$()方法获取到的内容叫做 jQuery对象
-
内部封装了大量的属性和方法,比如.oss()和.html()和.animate(等方法都是jQuery 对象的方法。
-
通过$()获取的元素是一组元素，进行操作时是批量操作。
2.3 jQuery 对象和原生js 对象
-
jQuery对象得到后，只能使用jQuery对象的方法，不能使用原生 js 元素对象的方法。
-
原生JS对象也不能使用 jQuery的方法。
-
jQuery对象实际是一个类数组对象，内部包含所有的获取的原生 js 对象，以及大量的jQuery 的方法和属性。
获取jQuery对象中原生js对象的个数
-
$().length
-
$().size()
2.4 js对象 jQ对象相互转换
-
jQuery 转原生:直接利用数组下标方式，得到jQuery 封装的原生对象。
-
原生转 jQuery:将原生对象用$()方法包裹即可。
三、jQuery选择器
3.1 CSS 2.1 和 CSS3 选择器
-
参数：必须是字符串格式的选择器。
3.2 筛选选择器
-
也叫过滤选择器，jQuery中新增的自己的选择器。
-
用法:在基础选择器后面增加一些筛选的单词，筛选出前面选择器的选中内容中一部分。或者可以作为高级选择器的一部分。
-
常用:
| 语法 | 描述 |
|---|---|
| $(':first') | 第一个 |
| $(':last') | 最后一个 |
| $(':eq(index)') | 下标为index的项 |
| $('gt(index)') | 大于下标为index的项 |
| $('lt(index)') | 小于下标为index的项 |
| $(':odd') | 下标为奇数的项 |
| $(':even') | 下标为偶数的项 |
| $(':not(selector)') | 去除所有与给定选择器匹配的元素 |
3.3 筛选方法
-
也叫过滤方法，jQuery 中除了用选择器选择元素，jQuery对象内还封装了一些对应的筛选方法。
-
常用:
| 语法 | 描述 |
|---|---|
| $('p').first() | 第一个 |
| $('p').last() | 最后一个 |
| $('p').eq(3) | 下标为3 |