锋利的jQuery

锋利的jQuery
每天都在图书馆查这本书,这两天终于等到别人还过来了,这几天借的书还不少,有十本,都快达上限了,就不能借一本自习看一本么!?
想起之前在一家IT公司实习的时候用jQuery的随意,殊不知jQuery是如此这般强大!看了两天图书馆已然有人归还第二版,速速换之。
书中很多实例很有趣,很值得自己去实现。

选择器

1.基本选择器
2.层次选择器 > + ~
3.过滤选择器
1.基本过滤 :first :not() :qe() :qt() :animated
2.内容过滤 :contains(text) :empty :has() :parent
3.可见性过滤 :hidden :visible
4.属性过滤 [attribute] [attribute^=value]
5.子元素过滤 nth-child(index) :first-child
6.表单对象过滤 :enabled :disabled
4.表单选择器 :input(input+button+textarea) :hidden


DOM操作

1.节点操作
1.创建节点
2.插入节点 append() prepend() apendTo() after() before()
3.删除节点 remove() empty()
4.复制节点 clone()
5.替换节点 replaceWith() replaceAll()
6.包裹节点 wrap()
2.属性操作 attr() removeAttr()
3.样式操作 addClass() removeClass() toggleClass() hasClass()


事件

1.DOM就绪后执行

1
2
3
$(ducument).ready(function(){}) 
$(function(){})
$().ready(function(){})

2.事件绑定

1
2
$("#a").bind("mouseover",function(){});
$("#a").mouseover(function(){}); 简写

可以一次性绑定多个事件

1
2
3
$("#a").bind("mouseover mouseout",function(){
$(this).toggleClass("over");
})

3.合成事件

1
2
hover(enter,leave)
toggle(f1,f2,...)

4.事件冒泡

1
2
3
4
$('span').bind("click",function(event){
event.stopPropagation(); 停止事件冒泡
event.preventDefault(); 阻止默认行为(如超链接的跳转)
})

5.事件对象
event.type
event.target
event.pageX 获取光标的坐标
event.which 鼠标单击的左中右键
6.移除事件

1
2
3
4
5
$('button').unbind();
最好在事件绑定时指定变量
$('button').bind("click",myFun1=function(){
...
})

One方法:触发一次,立即解绑

1
2
3
$('button').one("click",function(){
...
})

7.模拟操作 触发函数

1
$('button').trigger("click")

△添加命名空间 方便管理

1
2
3
4
$('button').bind("click.plugin",function(){
..
});
$('button').unbind(".plugin");


动画

1.show() & hide()
2.fadeIn() & fadeOut()
3.slideUp() & slideDown()
4.animate()

1
animate(params,speed,callback);

5.stop() & delay()
停止动画 stop()

1
2
stop(ClearQueue,gotoEnd)
Boolean值,前者清空队列,后者跳到当前动画的末状态

延迟动画 delay()
后借时间,单位ms
6.其他

1
2
3
4
toggle()
slideToggle()
fadeTo()
fageToggle()