高级应用
1.动画:
1.默认显式和隐式方式
*show([speed],[easing],[fn]]);
*hide([speed],[easing],[fn]]);
*toggle([speed],[easing],[fn]]);
参数:
*speed:动画速度,三个预定义("slow","normal","fast")
*easing:切换效果,默认swing,可选liner
*swing:开始慢,中间块,结尾慢
*liner:匀速
*fn:回调函数,在动画完成时执行的函数,每个元素执行一次。
2.滑动显示和隐藏方式
*slideDown([speed],[easing],[fn])
*slideUp([speed,[easing],[fn]])
*slideToggle([speed],[easing],[fn])
3.淡入淡出显示和隐藏方式
*fadeIn([speed],[easing],[fn])
*fadeOut([speed],[easing],[fn])
*fadeToggle([speed,[easing],[fn]])
jQuery遍历
jQuery对象本身就是数组对象,通过jQuery选择器获得的都是满足该选择器条件的元素对象的集合体。因此在常常需要对jQuery对象进行遍历。
1.JS遍历方式
for (初始化值; 循环结束条件; 步长);
2.jQuery遍历方式
1.jq对象.each(回调函数)
1.语法:jq对象.each(function(index,element){})
*index:元素在集合中的索引
*element:集合中每一个元素对象
2.回调函数返回值:
*true:结束循环(break)
*false:结束本次循环,继续下次循环(continue)
2.$.each(object,回调函数)
*此方法为JQuery对象特有的遍历方式,与1方法享受,但这里的$不是指特有对象,而是指全局对象的each方法,名字和功能虽然相同,但语法不同。
3.for...of
for (元素对象 of 容器对象);
jQuery事件绑定
事件名称 事件说明
blur 失焦
click 单击
change 内容改变
keydown 接受键盘所有的键
keypress 键盘按下
keyup 键盘松开
mouseover 鼠标悬停
mouseout 鼠标离开
1.jquery标准的绑定方式
1.jq对象.事件方法(回调函数);
*注:如果调用事件方法,不传递回调函数,则会触发浏览器默认行为。
*表单对象.submit();//让表单提交
2.on绑定事件/off解除绑定
* jq对象.on("事件名称",回调函数)
*jq对象.off("事件名称")
*如果off方法不传递任何参数,则将组件上的所有事件全部解绑
3.事件切换:toggle
*jq对象.toggle(fn1,fn2...)
*当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....