总结一下JQuery的常用API

jQuery基本语法：$(selector).action()

$:相当于jQuery对相关

(selector)：选择符（选择/查询）元素

action：对元素的操作

基本选择器：

标签选择器 $("div")阻止冒泡

event.prevenDefault()

event.stopPropagation()//兼容非IE

return false --结合了以上两个阻止冒泡的事件

通配符 $("*")

组选择器 $("ul,ol")

层级选择器

          1-后代选择器 $("ul li")

          2-子选择器 $("ul>li")

          3-兄弟相邻选择器 $("ul+ol")在ul下面的一个ol

          4-兄弟选择器 $("ul~ol")在ul下面的所有ol标签

方法

.text():设置/返回元素的文本内容

.html():设置/返回所选元素的内容（包括HTML标签）.html("<b>aaaa</b>")

.attr():设置属性attr("herf","http:baidu.com")修改多组属性内用{}

.val():获取到value的值

.clone():克隆匹配的DOM元素并且选中这些克隆的副本。

1:第一个布尔值（true 或者 false）指示事件处理函数是否会被复制。

2:第二个布尔值，指示是否对事件处理程序和克隆的元素的所有子元素的数据应该被复制。

伪类选择器

:contains()-查找含有指定字符串条件的元素

:first()-匹配第一个元素

:last()-匹配最后一个元素

:eq(index)-匹配一个给定索引值的元素

:even()-匹配所有索引值为偶数的元素

:odd()-匹配所有索引值为奇数的元素

:get(index)-匹配所有大于设定index索引值的元素

:lt(index)-匹配所有小于设定index索引值的元素

:not()-取非 $("input:not(':empty')")所有不为空的元素

:empty-匹配所有不包含子元素或者文本的空元素

:parent-匹配所有包含子元素/文本/不为空的元素

:header-匹配如h1，h2，h3之类的标题元素

:has()匹配含有选择器所匹配的元素的元素 $("div:has('p')")

子类选择器

:nth-child(index)-匹配所有索引值为index的元素 $("ul li:nth-child(3)")是匹配整个页面中ul的第3个li节点，（注：从1开始计算）

:first-child 匹配页面所有ul中的第一个子元素/:first只能匹配到第一个ul中的第一个li

:last-child 匹配页面所有ul中最后的一个子元素/ :last只能匹配到最后一个ul中的最后一个li

:only-child 匹配只有一个子元素的父元素中的子元素

:hidden() 匹配所有不可见的元素

:visible() 匹配所有可见的元素

表单选择器

:input 匹配所有表单元素input、textarea、select、button

:text 匹配所有单行文本框 $(":text")

:password 密码框

:radio 单选框

:checkbox 复选框

:submit 提交按钮

:reset 重置按钮

:button 按钮

:file 文件域

:image 图

表单对象属性

:enabled-选择器选取的所有启用的表单元素 $("input:enabled")

:disabled-匹配所有不可用的元素 $("input:disabled")

:checked-匹配所有被客户端选中的复选框、单选框等，不包括select中的option $(":checkbox:checked")

:selected-匹配所有被客户端选择的option $(":select:selectde")

属性选择器

[attribute] 匹配包含指定属性的元素$(["id"])--$("div[id]")包含id的属性的div

[attribute = vaule] 选择器选取带指定属性和属性值的每个元素 $("div[id='d']")

[attribute != value] 匹配属性值不等于指定值，带有该属性的元素 $("div[id != 'a']")

[attribute $=value ] 选择选取每个带有指定属性，且属性值是以指定字符串结尾的元素

[attribute |= value] 匹配带指定属性且以指定字符串开头的属性（要注意的是，指定字符串开头后面是用连接符连接）值的元素 <div id = 'div-1'></div>   $('div[id |="div" ]')

[attribute ^= value] 选择每个带有指定属性而且以指定字符串开头的元素 $('div[id ^="div" ]')

[attribute ~= value] 选择选取每个带有指定属性且值包含指定单词的元素

[attribute *= value] 匹配给定的属性是包含某些值的元素。只要属性值中包含到就可以有

筛选

.slice(star,stop):选取一个索引值范围内的所有元素，选取的范围[start，stop）

.fliter():筛选出与指定表达式匹配的元素集合,用于缩小匹配的范围。用逗号分隔多个表达式

.find():搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。

.eq():获取第index个元素 $("li").eq(-1)到数第一个元素

.first():获取第一个元素，$("li").fist()

.last():获取最后一个元素

增删类名：

hasClass():检查当前的元素是否含有某个特定的类，如果有，则返回true。

addClass():添加一个类

removeClass():删除一个类

toggleClass():如果存在（不存在）就删除（添加）一个类。相当于addClass和

元素隐藏和显示：

hide()	这个就是 'hide( speed, [callback] )' 的无动画版。如果选择的元素是隐藏的，这个方法将不会改变任何东西。
show()	如果选择的元素是可见的，这个方法将不会改变任何东西。无论这个元素是通过hide()方法隐藏的还是在CSS里设置了display:none;，这个方法都将有效。
toggle()	hide和show方法的集合

改变被选元素的高度来动画：

slideDown():

slideDown(speed,easing,fn) 通过高度变化（向下增大）来动态地显示所有匹配的元素，在显示完成后可选地触发一个回调函数。这个动画效果只调整元素的高度，可以使匹配的元素以“滑动”的方式显示出来。在jQuery 1.3中，上下的padding和margin也会有动画，效果更流畅。

slideUp():通过改变被选元素高度，向上隐藏

slideToggle():改变被选元素的高度，相当于slideU和sildeDown的结合

改变被选元素的透明度：

fadeIn():有隐藏到可见

fadeOut():有可见到隐藏，到最后完全隐藏（透明度为0）被选元素会不占文档流

fadeTogglele():结合了fadeIn和fadeOut

三个参数：speed-"slow"/"normal"/"fast"或者是毫秒数1000=1s;

          easing-默认swing可用linear用来指定切换效果

          fn-回调函数

fadeTo():把多有匹配的元素的不透明以渐进的方式调整到指定的透明度数，并在运动完成的时候回调函数并且透明度为0时，不会移除该元素，是占用了文档流的。

自定义动画animate

animate()方法执行css属性来子自定义动画--以下为该传入的所有参数

params:一组包含作为动画属性和终值的样式属性和及其值的集合{属性：属性值，width:"10px"}

speed:三种预定速度之一("slow","normal", or "fast")或表示动画时长的毫秒数值(如：1000)

easing:要使用的擦除效果的名称(需要插件支持).默认jQuery提供"linear" 和 "swing".

fn:在动画完成时执行的函数，每个元素执行一次。

父元素子元素

siblings():取得被选元素的所有兄弟元素，除自己以外的兄弟元素

children():获取被选元素的所有子元素的集合

closest():返回被选元素的第一个祖元素 $("span").closest("ul")-->ul

父元素的选取

parent():取得一个被选元素的父元素；

parents():返回被选元素的所有祖先元素 $("span").parents()-->li-ul-div-body-html

parentsUntil():返回被选元素到指定元素（不包括自身）范围之间的所有父元素 $("span").parentsUntil("div")-->li/ul

以下的next选择不包括自身，对同级有效

next():返回被选元素后面单个同级元素

nextAll():返回被选元素后面的所有同级元素

nextUntil():返回两个给定参数之间的元素（start,stop） $("li.start").nextUntil("li.stop")

以下的prev用法和next一样，作用和next相反

prev():返回被选元素的前一个元素

prevAll():

prevUntil():

创建节点：

工厂模式：$("<p></p>")

插入子节点：

.append():  $(A).append(B) 在A中加入B

.appendTo():  $(A).appendTo(B) 把A追加到B中

.prepend(): $(A).prepend(B) 把B前置在A中

.prependTo(): $(A).prependTo(B) 把A前置在B中

元素外部插入同辈节点：

.after(): $(A).after(B)把B插到A元素的后面

.insertAfter(): $(A).insertAfter (B)把A插到B元素的后面

.before(): $(A).before(B)把B插入到A的面前

.insertbefore(): $(A).insertbefore(B)把A插入到B的面前

阻止冒泡

event.prevenDefault()

event.stopPropagation()//兼容非IE

return false --结合了以上两个阻止冒泡的事件

鼠标事件：

.hover(function(){},function(){})：相当于mouseover和mouseout的集合

.click():鼠标单击时触发

.dblclick():鼠标双击时触发

.mouseenter():鼠标移入时触发/.mouseover()

.mouseleave():鼠标移出时触发/.mouseout()

(1)mouseenter:只有鼠标移入到被选元素时才会触发，进入被选元素的子元素时是不会被触发的）

(2)mouseover:鼠标移入被选元素时会被触发一次，移到被选元素的子元素时也会被触发一次

.mousedown():鼠标按下时触发

.mouseup():鼠标松开时触发

.mousemove():鼠标在被选元素内移动时触发

滚动事件

.scroll():当用户滚动指定元素的时候触发 滚动浏览器 $(window).scroll(function(){})

.scrollTop():获取匹配元素相对滚动条距离

.scrollLeft():

.offset():获取匹配元素在当前可视区域的相对偏移量 $("div").offset().top/left

文档/窗口事件：

.blur():当元素失去焦点时触发

.focus():当元素获取焦点时触发

.bind():绑定事件/.on()

事件绑定的一些区别：

$(document).on('click','#id',function(){}).on('mouseover',function(){});

$('#id').blind('click',function(){});

outerHeight([options])获取第一个匹配元素外部高度（默认包括补白和边框）