Jqurey总结归纳

1、jQuery的基本用法

//引入jQuery文件，可以本地也可以远程
<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript">
//当文档完成加载完时触发，避免获取dom对象时，dom对象还没有加载
$(document).ready(function(){
//写js语句或者jQuery函数
$("p").click(function(){
$(this).hide();
});
});
</script>

2.语言特点

快速获取文档元素

jQuery的选择机制构建于Css的选择器，它提供了快速查询DOM文档中元素的能力，而且大大强化了JavaScript中获取页面元素的方式。

提供漂亮的页面动态效果

jQuery中内置了一系列的动画效果，可以开发出非常漂亮的网页，许多网站都使用jQuery的内置的效果，比如淡入淡出、元素移除等动态特效。

提供对JavaScript语言的增强

jQuery提供了对基本JavaScript结构的增强，比如元素迭代和数组处理等操作。

增强的事件处理

jQuery提供了各种页面事件，它可以避免程序员在HTML中添加太多事件处理代码，最重要的是，它的事件处理器消除了各种浏览器兼容性问题。

更改网页内容

jQuery可以修改网页中的内容，比如更改网页的文本、插入或者翻转网页图像，jQuery简化了原本使用JavaScript代码需要处理的方式。

3.选择器

jQuery 选择器允许您对 HTML 元素组或单个元素进行操作。

jQuery 选择器基于元素的 id、类、类型、属性、属性值等"查找"(或选择)HTML 元素。 它基于已经存在的CSS 选择器，除此之外，它还有一些自定义的选择器。

jQuery 中所有选择器都以美元符号开头:$()。

元素选择器

jQuery 元素选择器基于元素名选取元素。

在页面中选取所有 <p> 元素

id 选择器

jQuery #id 选择器通过 HTML 元素的 id 属性选取指定的元素。

页面中元素的 id 应该是唯一的，所以您要在页面中选取唯一的元素需要通过 #id 选择器。

通过 id 选取元素语法如下:

class 选择器

jQuery 类选择器可以通过指定的 class 查找元素。

4.常用的 jQuery 操作

4.1jQuery文档操作

函数	描述
append()	向每个匹配的元素内部追加内容。
appendTo()	把所有匹配的元素追加到另一个指定的元素元素集合中。
prepend()	向每个匹配的元素内部前置内容。
prependTo()	把所有匹配的元素前置到另一个、指定的元素元素集合中。
after()	在每个匹配的元素之后插入内容。
insertAfter()	把所有匹配的元素插入到另一个、指定的元素元素集合的后面。
insertBefore()	把所有匹配的元素插入到另一个、指定的元素元素集合的前面。
wrap()	把所有匹配的元素用其他元素的结构化标记包裹起来。
unwrap()	这个方法将移出元素的父元素。
replaceWith()	将所有匹配的元素替换成指定的HTML或DOM元素。
empty()	删除匹配的元素集合中所有的子节点。
remove()	从DOM中删除所有匹配的元素。
clone()	克隆匹配的DOM元素并且选中这些克隆的副本。

4.2jQuery筛选操作

eq()	获取第N个元素
first()	获取第一个元素
last()	获取最后一个元素
hasClass()	检查当前的元素是否含有某个特定的类，如果有，则返回true。
filter()	筛选出与指定表达式匹配的元素集合。
map()	将一组元素转换成其他数组（不论是否是元素数组）
has()	保留包含特定后代的元素，去掉那些不含有指定后代的元素。
not()	删除与指定表达式匹配的元素
slice()	选取一个匹配的子集
children()	取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。
next()	取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。
nextall()	查找当前元素之后所有的同辈元素。
offsetParent()	返回第一个匹配元素用于定位的父节点。
parent()	取得一个包含着所有匹配元素的唯一父元素的元素集合。
parents()	取得一个包含着所有匹配元素的祖先元素的元素集合（不包含根元素）。可以通过一个可选的表达式进行筛选。
prev()	取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。
add()	把与表达式匹配的元素添加到jQuery对象中。这个函数可以用于连接分别与两个表达式匹配的元素结果集。
contents()	查找匹配元素内部所有的子节点（包括文本节点）。如果元素是一个iframe，则查找文档内容
end()	回到最近的一个"破坏性"操作之前。即，将匹配的元素列表变为前一次的状态。

4.3jQuery事件方法

ready()	当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
on()1.7+	在选择元素上绑定一个或多个事件的事件处理函数。
off()1.7+	在选择元素上移除一个或多个事件的事件处理函数。
bind()	为每个匹配元素的特定事件绑定事件处理函数。
one()	为每一个匹配元素的特定事件（像click）绑定一个一次性的事件处理函数。
trigger()	在每一个匹配的元素上触发某类事件。
triggerHandler()	这个特别的方法将会触发指定的事件类型上所有绑定的处理函数。但不会执行浏览器默认动作，也不会产生事件冒泡。
unbind()	bind()的反向操作，从每一个匹配的元素中删除绑定的事件。
delegate()	方法添加的一个或多个事件处理程序。
hover()	一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。
toggle()	用于绑定两个或多个事件处理器函数，以响应被选元素的轮流的 click 事件。
blur()	当元素失去焦点时触发 blur 事件。
change()	当元素的值发生改变时，会发生 change 事件。
click()	触发每一个匹配元素的click事件。
dblclick()	当双击元素时，会发生 dblclick 事件。
error()	当元素遇到错误（没有正确载入）时，发生 error 事件。
focus()	当元素获得焦点时，触发 focus 事件。
focusin()	当元素获得焦点时，触发 focusin 事件。
focusout()	当元素失去焦点时触发 focusout 事件。
keydown()	当键盘或按钮被按下时，发生 keydown 事件。
keypress()	当键盘或按钮被按下时，发生 keypress 事件。
keyup()	当按钮被松开时，发生 keyup 事件。它发生在当前获得焦点的元素上。
mousedown()	当鼠标指针移动到元素上方，并按下鼠标按键时，会发生 mousedown 事件。
mouseleave()	当鼠标指针离开元素时，会发生 mouseleave 事件。
mousemove()	当鼠标指针在指定的元素中移动时，就会发生 mousemove 事件。
mouseout()	当鼠标指针从元素上移开时，发生 mouseout 事件。
mouseover()	当鼠标指针位于元素上方时，会发生 mouseover 事件。
mouseup()	当在元素上放松鼠标按钮时，会发生 mouseup 事件。
resize()	当调整浏览器窗口的大小时，发生 resize 事件。
scroll()	当用户滚动指定的元素时，会发生 scroll 事件。
select()	当 textarea 或文本类型的 input 元素中的文本被选择时，会发生 select 事件。
submit()	当提交表单时，会发生 submit 事件。
unload()	在当用户离开页面时，会发生 unload 事件。

4.4jQuery效果

show()	显示隐藏的匹配元素。
hide()	隐藏显示的元素
toggle()	用于绑定两个或多个事件处理器函数，以响应被选元素的轮流的 click 事件。
slideDown()	通过高度变化（向下增大）来动态地显示所有匹配的元素，在显示完成后可选地触发一个回调函数。
slideUp()	通过高度变化（向上减小）来动态地隐藏所有匹配的元素，在隐藏完成后可选地触发一个回调函数。
slideToggle()	通过高度变化来切换所有匹配元素的可见性，并在切换完成后可选地触发一个回调函数。
fadeIn()	通过不透明度的变化来实现所有匹配元素的淡入效果，并在动画完成后可选地触发一个回调函数。
fadeOut()	通过不透明度的变化来实现所有匹配元素的淡出效果，并在动画完成后可选地触发一个回调函数。
fadeTo()	把所有匹配元素的不透明度以渐进方式调整到指定的不透明度，并在动画完成后可选地触发一个回调函数。
fadeToggle()	通过不透明度的变化来开关所有匹配元素的淡入和淡出效果，并在动画完成后可选地触发一个回调函数。
animate()1.8*	用于创建自定义动画的函数。
stop()1.7*	停止所有在指定元素上正在运行的动画。
delay()	设置一个延时来推迟执行队列中之后的项目。
finish()1.9+	停止当前正在运行的动画，删除所有排队的动画，并完成匹配元素所有的动画。
jQuery.fx.off	关闭页面上所有的动画。
jQuery.fx.interval	设置动画的显示帧速。