---学习视频是黑马程序员pink老师的教学视频
3.2 jQuery样式操作
3.2.3 案例：tab栏切换案例
jQuery
- 商品介绍
- 规格与包装
- 售后保障
- 商品评价
- 手机社区
商品介绍模块内容
规格与包装模块内容
售后保障模块内容
商品评价模块内容
手机社区模块内容
丑不重要 起码说明是我自己做的 o_o
3.2.4 jQuery类操作和className的区别
原生js中 className会覆盖元素原先的类名
jQuery里面类操作只是对指定类进行操作，不影响原先的类名
3.3 jQuery效果
3.3.1 常见效果
显示隐藏
show()
hide()
toggle()
滑动
sideDown()
sideUp()
slideToggle()
淡入淡出
fadeIn()
fadeOut()
fadeToggle()
fadeTo
自定义动画
animate()
3.3.2 显示隐藏效果
1.显示语法规范
show([speed,[easing],[fn]])
2.显示语法参数
（1）参数都可以省略
（2）speed：三种预定速度之一的字符串（“slow”，“normal”，or “fast”）或表示动画时长的毫秒数值（如：1000）
(3) easing:(Optional)用来指定切换效果，默认是“swing”，可用参数“inear”
（4）fn：回调函数，在动画完成是执行的函数每个元素执行一次
jQuery
3.2.3 jQuery滑动效果
下滑效果语法规范
slideDown([speed,[easing],[fn]])
参数
（1）参数都可以省略
（2）speed：三种预定速度之一的字符串（“slow”，“normal”，or “fast”）或表示动画时长的毫秒数值（如：1000）
(3) easing:(Optional)用来指定切换效果，默认是“swing”，可用参数“inear”
（4）fn：回调函数，在动画完成是执行的函数每个元素执行一次
切换事件
hover([over],out)
1 over:鼠标移到元素上要触发的函数（相当于mouseenter）
2 out：鼠标移除元素触发（相当于mouseleave）
事件切换 hover 就是鼠标经过和离开的复合写法
事件切换 hover 如果只写一个函数 那么鼠标经过和离开都会触发这个函数
jQuery
3.3.4 动画队列及其停止方法
1 动画或效果队列
动画或者效果一旦触发就会执行，如果多次触发，就造成多个动画或效果排队执行
2 停止排队
stop()
（1）stop()方法用于停止动画或效果.
（2）注意：stop（）写到动画或者效果的前面 ， 相当于停止结束上一次的动画
3.3.5 淡入淡出方法
1 fadeIn () 淡入
2 fadeOut () 淡出
3 fadeToggle () 切换
4 fadeTo () 给透明度
3.3.6 自定义动画 animate
1.语法
anmiate(params,[speed],[fn])
2.参数
（1）params：想要更改的样式属性，以对象形式传递，必须写。属性名可以不用加引号，如果是复合属性则需要采用驼峰命名法 如： borderLeft
其余参数可省略
jQuery
1、陈述问题（白帽子）
2、提出解决问题的方案（绿帽子）
3、评估该方案的优点（黄帽子）
4、列举该方案的缺点（黑帽子）
5、对该方案进行直觉判断（红帽子）
6、总结陈述，做出决策（蓝帽子）
3.4 jQuery 属性操作
3.4.1设置或获取元素固有属性值prop（）
所谓元素固有属性就是元素本身自带的属性，比如元素里面的href，比如元素里面的type
获取属性语法
prop("属性")设置属性语法
prop("属性","属性值")
3.4.2 设置或获取元素自定义属性值 attr()
元素的自定义属性 我们通过attr（）
attr("属性") //类似原生 getAttribute()
attr("属性","属性值") //类似原生：setAttrbute()
3.4.3 数据缓存 data()
data()方法可以在指定的元素上存取数据，并不会修改DOM元素结构，一旦页面刷新，之前存放的数据都将被移除
3.5 jQuery内容文本值
3.5.1 获取元素内容
1.普通元素内容html() (相当于原生innerHTML)
html() //获取元素内容
html("设置元素的内容")
2.普通元素文本内容text() (相当于原生的innerText)
3.6 jQuery元素操作
主要是遍历 创建 添加 删除 元素操作
3.6.1遍历元素
jQuery隐式迭代是对同一类元素做了同样的操作，如果想要给同一类元素做不同操作，就需要用到遍历
语法一：
$("div").each(function(index,domEle){xxx;})
1 each()方法遍历匹配每一个的元素，主要用DOM处理 each每一个
2 里面的回调函数有两个参数 ：index是每个元素的索引号，demEle是每个DOM对象，不是jQuery对象
3所以要想使用jQuery方法，需要给这个dom元素转换为jQuery对象$(domEle)
语法二：
$.each(object , function (index,element){ xxx; }))
1 $.each()的方法可以用于遍历任意对象，主要用于数据处理，比如数组，对象
2 里面有两个参数： index是索引号 element遍历内容