jQuery是一个快速、简洁的JavaScript库，倡导写更少的代码做更多的事情
jQuery的介绍
j就是JavaScript；
query查询
意思就是把js中的DOM操作做了封装，我们可以快速的查询使用里面的功能
jQuery封装了JavaScript常用的功能代码，优化了DOM操作、事件处理、动画设计和Ajax交互
学习jQuery本质就是学习调用这些函数（方法）
jQuery的优点
- 轻量级、核心文件才几十kb，不会影响页面加载速度
- 扩浏览器兼容，基本兼容了现在主流的浏览器
- 链式编程、隐式迭代
- 对事件、样式、动画支持，大大简化了DOM操作
- 支持插件扩展开发，有着丰富的第三方的插件，例如：树形菜单、日期控件、轮播图等
- 免费、开源
一.jQuery选择器
$("选择器")//里面直接写CSS选择器即可，但是要加引号
二.jQuery样式操作
jQuery可以使用css方法来修改简单元素样式；也可以操作类，修改多个样式
①参数只写属性名，返回属性值
$(this).css("color");②参数是属性名，属性值，并用逗号分隔，是设置一组样式，属性必须加引号
$(this).css("color","red")③参数可以是对象形式，方便设置多组样式。属性名和属性值用冒号隔开，属性可以不用加引号
$(this).css({
"color":"white",
"font-size":"20px"
});①添加类
$("div").addClass("current");②移除类
$("div").removeClass("current");③切换类
$("div").toggleClass("current");原生JS中className会覆盖元素原先里面的类名
jQuery里面类操作只是对指定类进行操作，不影响原先的类名
（相当于追加类名，不影响以前的类名）
三.jQuery效果
①显示语法规范
show([speed,[easing],[fn]])②显示参数
（1）参数都可以省略，无动画直接显示
（2）speed：三种预定速度之一的字符串（“slow”，“normal”，or “fast”）或表示动画时长的毫秒数值（如：1000）
（3）easing：（Optional）用来指定切换效果，默认是“swing”，可用参数“linear”
（4）fn：回调函数，在动画完成时执行的函数，每个元素执行一次
①隐藏语法规范
hide([speed,[easing],[fn]]) ②隐藏参数
（1）参数都可以省略，无动画直接隐藏
（2）speed：三种预定速度之一的字符串（“slow”，“normal”，or “fast”）或表示动画时长的毫秒数值（如：1000）
（3）easing：（Optional）用来指定切换效果，默认是“swing”，可用参数“linear”
（4）fn：回调函数，在动画完成时执行的函数，每个元素执行一次
①下滑效果语法规范
slideDown([speed,[easing],[fn]])
slideUp([speed,[easing],[fn]])
slideToggle([speed,[easing],[fn]]) ②下滑效果参数
（1）参数都可以省略
（2）speed：三种预定速度之一的字符串（“slow”，“normal”，or “fast”）或表示动画时长的毫秒数值（如：1000）
（3）easing：（Optional）用来指定切换效果，默认是“swing”，可用参数“linear”
（4）fn：回调函数，在动画完成时执行的函数，每个元素执行一次
hover([over,]out)例：
$(".nav>li").hover(function(){},function(){})如果只写一个函数，鼠标经过和鼠标离开都会触发这个函数
$(".nav>li").hover(function(){
$(this).children("ul").slideToggle();
})①over：鼠标移到元素上要触发的函数（相当于mouseenter）
②out：鼠标移出元素要触发的函数（相当于mouseleave）
①淡入淡出效果语法规范
//淡入效果：
fadeIn([speed,[easing],[fn()]])
//淡出效果：
fadeOut([speed,[easing],[fn()]])
//淡入淡出切换效果
fadeToggle([speed,[easing],[fn()]])②淡入效果参数
（1）参数都可以省略
（2）speed：三种预定速度之一的字符串（“slow”，“normal”，or “fast”）或表示动画时长的毫秒数值（如：1000）
（3）easing：（Optional）用来指定切换效果，默认是“swing”，可用参数“linear”
（4）fn：回调函数，在动画完成时执行的函数，每个元素执行一次
①渐进方式调整到指定的不透明度
fadeTo([speed],opacity,[easing],[fn()]) ②效果参数
（1）opacity：透明度必须写，取值0~1之间
（2）speed：三种预定速度之一的字符串（“slow”，“normal”，or “fast”）或表示动画时长的毫秒数值（如：1000）。必须写
（3）easing：（Optional）用来指定切换效果，默认是“swing”，可用参数“linear”
①语法：
animate(params,[speed],[easing],[fn]) ②参数：
（1）params：想要更改的样式属性，以对象形式传递，必须写，属性名可以不用带引号，如果是复合属性则需要采用驼峰命名法borderLeft。其余参数都可以省略
（2）speed：三种预定速度之一的字符串（“slow”，“normal”，or “fast”）或表示动画时长的毫秒数（如：1000）
（3）easing：（Optional）用来指定切换效果，默认是“swing”，可用参数“linear”
（4）fn：回调函数，在动画完成时执行的函数，每个元素执行一次
$(function(){
$("button").click(function(){
$div.animate({
left:500
},500);
})
}) ①动画或效果队列
动画或效果一旦触发就会执行，如果多次触发就造成多个动画或效果排队执行
②停止排队
stop()stop()方法用于停止动画或效果
注意：stop()写到动画或者效果的前面，相当于结束上一次的动画
$(".nav>li").hover(function(){
$(this).children("ul").stop().slideToggle();
})四.jQuery属性操作
所谓元素固有属性就是元素本身自带的属性，比如《a》元素里面的href，比如input元素里面的type
element.prop(“属性名”)
element.prop(“属性名”，“属性值”)
element.attr(“属性名”)
element.attr(“属性名”，“属性值”)
data()方法可以在指定的元素上存取数据，并不会修改DOM元素结构，一旦页面刷新，之前存放的数据都将被移除
①date(“name”,“value”) //向被选元素附加数据
②date(“name”) //向被选元素获取数据
五.jQuery内容文本值
html() //获取元素的内容
html("内容") //设置元素的内容text() //获取元素的文本内容
text("内容") //设置元素的文本内容val() //获取元素的设置表单值
val("内容") //设置元素的设置表单值六.jQuery元素操作
主要是遍历、创建、添加、删除元素操作
jQuery隐式迭代是对同一类元素做了同样的操作。如果想要给同一类元素做不同操作，都需要用到遍历
语法一:
$("div").each(function(index,domEle){xxx;})
①each()方法遍历匹配的每一个元素。主要用DOM处理。each每一个
②里面的回调函数有2个参数：index是每个元素的索引号；demEle是每个DOM元素对象，不是jQuery对象
③所以要想使用jQuery方法，需要给这个dom元素转换为jQuery对象$(domEle)
语法二:
$.each(object,function(index,element){xxx;}) ①$.each()方法可用于遍历任何对象，比如数组，对象
②里面函数有2个参数：index是每个元素的索引号；element遍历内容
语法：$("<li></li>");
①内部添加
element.append("内容") 把内容放入匹配元素内部最后面，类似原生appendChilid
element.prepend("内容") 把内容放入匹配元素内部最前面
②外部添加
element.after("内容") 把内容放入目标元素后面
element.before("内容") 把内容放在目标元素前面
语法：element.remove() 删除匹配的元素
语法：element.empty() 删除匹配元素里面的子节点
语法：element.html("") 删除匹配元素里面的子节点
七.jQuery事件操作
单个事件注册
element.事件(function(){}) 例：$("div").click(function(){})
事件处理on()绑定事件
on()方法在匹配元素上绑定一个或多个事件的事件处理函数
1.events:一个或多个用空格分割的事件类型，如“click”或"keydown"
2.selector:元素的子元素选择器
3.fn:回调函数，即绑定在元素身上的侦听函数
element.on(events,[selector],fn)
