前面学习了DOM和BOM知道了如何与浏览器进行交互，本篇博客将介绍关于jQuery的知识，那么我们学习jQuery究竟有什么作用呢，通过前面的学习，不难发现JS语句都非常长，实现一个功能要写很多行语句，那么jQuery就是将DOM对象包装起来，形成jQuery对象，相比用JS语句写代码，jQuery就更加简便。
一、jQuery的选择器以及筛选器
1.选择器
1.id选择器 $("#id")
2.标签选择器 $("标签名")
3.class选择器 $(".class名")
4.所有元素选择器 $("*")
5.子子孙孙选择器 $("x y")
6.儿子选择器 $("x>y")
7.弟弟选择器 $("x~y")(与自己同一层级的元素)
8.毗邻选择器 $(“x + y“)（找到紧挨在x后面的y元素）
9.属性选择器 [属性名]
[属性名=value]// 属性等于
[属性名!=value]// 属性不等于
属性选择器例子
<input type="password">
<input type="checkbox">
$("input[type='checkbox']"); 取属性值为checkbox的标签
$("input[type!='text']");// 取属性值为text的标签
2.筛选器
1.:first $("div:first") 找出div后代元素的第一个元素
2.:last $("div:last") 找出div后代元素的最后一个元素
3.:eq(index) $("div:eq(inde索引数字)") 找出div后代中指定索引位置的元素
4.:even $("div:even") 找出所有索引值为偶数的元素
5.:odd $("div:odd") 找出所有索引值为奇数的元素
6.:gt(index) $("div:gt(index)") 找出所有大于给定索引值的元素
7.:lt(index) $("div:lt(index)") 找出所有小于给定索引值的元素
8.:not(元素选择器) $(div:not(.c1)) 移除所有满足not条件的标签
9.:has(元素选择器) $("div:has(.c1)") 选取所有包含一个或多个标签在其内的标签(指的是从后代元素找)
10.:text
11.:password
12.:file
13.:radio
14.:checkbox
15.:submit
16.:reset
17.:button
11-17为表单筛选器 具体用法如下：
$(":checkbox") 找出所有的checkbox元素
表单筛选器中表单对象的属性（划重点）
:enabled 找出不可用的标签
:disabled 找出可用的标签
:checked 找到被选中的标签（checkbox，radio）
:selected 找到被选中的标签（option）
3.筛选方法
用法： $("#id").方法
.next() //下一个元素（同级） .nextAll() //下面的所有元素 .nextUntil("#i2") //下面直到id为i2的所有元素
.prev() //上一个元素（同级） .prevAll() //上面的所有元素 .prevUntil("#i2") //上面直到id为i2的所有元素
.parent()//父亲元素 .parents() //所有的父辈元素 .parentsUntil(“#i2”)//查找父辈的所有元素直到遇见id为i2的元素
$("#id").children() //获取id为i2的儿子们元素
$("#id").siblings() //获取id为i2的兄弟们元素
查找
搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。
他的效率最高
用法： $("div").find("a")
4.操作标签
1.样式操作(主要对class操作)
1.addClass();// 添加指定的CSS类名。
2.removeClass();// 移除指定的CSS类名。
3.hasClass();// 判断样式存不存在
4.toggleClass();// 切换CSS类名，如果有就移除，如果没有就添加。
2.位置操作
offset()// 获取匹配元素在当前窗口的相对偏移或设置元素位置
position()// 获取匹配元素相对父元素的偏移
scrollTop()// 获取匹配元素相对滚动条顶部的偏移
scrollLeft()// 获取匹配元素相对滚动条左侧的偏移
3.尺寸
height()
width()
innerHeight() //内容区加padding
innerWidth()
outerHeight()//内容加padding加border
outerWidth()
4.文本操作
1.HTML代码
1. .html 取得所有匹配元素的内容
2. .html(val) 设置所有匹配元素的html内容，用于添加标签
1.文本值
1. .text 取得所有匹配元素的内容
2. .text(val) 设置所有匹配元素的值
3.值
1. .val() 永远默认获取第一个的值 value
5.事件
1.事件的常用种类
click(function(){...}) 点击
hover(function(){...}) 悬浮
blur(function(){...}) 失去焦点
focus(function(){...}) 获取焦点
change(function(){...})
keyup(function(){...})
2.事件的绑定
时间的绑定方式 .on( events [, selector ],function(){})
events： 事件
selector: 选择器（可选的）
function: 事件处理函数
3.移除事件
.off(event[,selector][,function(){}])
off()方法移除用.on()绑定的事件处理程序