jquery
jQuery教程
•jQuery教程
•jQuery简介
•jQuery语法
•jQuery选择器
•jQuery事件
•jQuery效果
•jQueryCallback
•jQueryHTML
•jQueryCSS
•jQueryAJAX
•jQuery实例
一、jQuery简介
jQuery库可以通过一行简单的标记被添加到网页中。
jQuery库-特性
jQuery是一个JavaScript函数库。
jQuery库包含以下特性：
•HTML元素选取
•HTML元素操作
•CSS操作
•HTML事件函数
•JavaScript特效和动画
•HTMLDOM遍历和修改
•AJAX
•Utilities
向您的页面添加jQuery库
jQuery库位于单个的JavaScript文件中，其中包含所有jQuery函数。
可以通过下面的标记把jQuery添加到网页中：
<head>
<scripttype="text/javascript"src="jquery.js"></script>
</head>
请注意，<script>标签应该位于页面的<head>部分。
基础jQuery实例
下面的例子演示了jQuery的hide()函数，隐藏了HTML文档中所有的<p>元素。
实例
<html>
<head>
<scripttype="text/javascript"src="jquery.js"></script>
<scripttype="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>Thisisaheading</h2>
<p>Thisisaparagraph.</p>
<p>Thisisanotherparagraph.</p>
<buttontype="button">Clickme</button>
</body>
</html>
通过jQuery，您可以选取（查询，query）HTML元素，并对它们执行“操作”（actions）。
jQuery语法实例
$(this).hide()
演示jQueryhide()函数，隐藏当前的HTML元素。
$("#test").hide()
演示jQueryhide()函数，隐藏id="test"的元素。
$("p").hide()
演示jQueryhide()函数，隐藏所有<p>元素。
$(".test").hide()
演示jQueryhide()函数，隐藏所有class="test"的元素。
二、jQuery语法
jQuery语法是为HTML元素的选取编制，可以对元素执行某些操作。
基础语法是：$(selector).action()
•美元符号定义jQuery
•选择符（selector）“查询”和“查找”HTML元素
•jQueryaction()执行对元素的操作
实例
$(this).hide()-隐藏当前元素
$("p").hide()-隐藏所有段落
$("p.test").hide()-隐藏所有class="test"的段落
$("#test").hide()-隐藏所有id="test"的元素
提示：jQuery使用的语法是XPath与CSS选择器语法的组合。在本教程接下来的章节，您将学习到更多有关选择器的语法。
文档就绪函数
您也许已经注意到在我们的实例中的所有jQuery函数位于一个documentready函数中：
$(document).ready(function(){
---jQueryfunctionsgohere----
});
这是为了防止文档在完全加载（就绪）之前运行jQuery代码。
下面是两种假如文档完全加载之前运行函数的话，操作失败的情况：
•试图隐藏一个不存在的元素。
•获得未完全加载的图像的大小。
选择器允许您对元素组或单个元素进行操作。
三、jQuery选择器
在前面的章节中，我们展示了一些有关如何选取HTML元素的实例。
关键点是学习jQuery选择器是如何准确地选取您希望应用效果的元素。
jQuery元素选择器和属性选择器允许您通过标签名、属性名或内容对HTML元素进行选择。
选择器允许您对HTML元素组或单个元素进行操作。
在HTMLDOM术语中：
选择器允许您对DOM元素组或单个DOM节点进行操作。
jQuery元素选择器
jQuery使用CSS选择器来选取HTML元素。
$("p")选取<p>元素。
$("p.intro")选取所有class="intro"的<p>元素。
$("p#demo")选取id="demo"的第一个<p>元素。
jQuery属性选择器
jQuery使用XPath表达式来选择带有给定属性的元素。
$("[href]")选取所有带有href属性的元素。
$("[href='#']")选取所有带有href值等于"#"的元素。
$("[href!='#']")选取所有带有href值不等于"#"的元素。
$("[href$='.jpg']")选取所有href值以".jpg"结尾的元素。
jQueryCSS选择器
jQueryCSS选择器可用于改变HTML元素的CSS属性。
下面的例子把所有p元素的背景颜色更改为红色：
实例
$("p").css("background-color","red");
TIY
更多的实例
语法描述
$(this)当前HTML元素
$("p")所有<p>元素
$("p.intro")所有class="intro"的<p>元素
$(".intro")所有class="intro"的元素
$("#intro")id="intro"的第一个元素
$("ulli:first")每个<ul>的第一个<li>元素
$("[href$='.jpg']")所有带有以".jpg"结尾的href属性的属性
$("div#intro.head")id="intro"的<div>元素中的所有class="head"的元素
四、jQuery事件函数
jQuery是为事件处理特别设计的。
jQuery事件处理函数是jQuery中的核心函数。
事件处理函数是当HTML中发生事件时自动被调用的函数。由“事件”（event）“触发”（triggered）是经常被用到的术语。
在您<head>中
由于jQuery是为事件处理特别设计的，通常是把jQuery代码置于网页<head>部分的“事件处理”函数中：
实例
<html>
<head>
<scripttype="text/javascript"src="jquery.js"></script>
<scripttype="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>Thisisaheading</h2>
<p>Thisisaparagraph.</p>
<p>Thisisanotherparagraph.</p>
<buttontype="button">Clickme</button>
</body>
</html>
TIY
在上面的例子中，定义了一个处理HTML按钮的点击事件的click函数：
$("button").click(function(){..somecode...})
click函数内部的代码隐藏所有<p>元素：
$("p").hide();
所有事件函数都在文档自身的“事件处理器”内部进行定义：
$(document).ready(function(){..somecode...})
单独文件中的函数
如果您的网站包含许多页面，并且您希望您的jQuery函数易于维护，那么请把您的jQuery函数放到独立的.js文件中。
当我们在教程中演示jQuery时，会将函数直接添加到<head>部分中。不过，把它们放到一个单独的文件中会更好，就像这样（通过src属性来引用文件）：
实例
<head>
<scripttype="text/javascript"src="jquery.js"></script>
<scripttype="text/javascript"src="my_jquery_functions.js"></script>
</head>
jQuery名称冲突
jQuery使用$符号作为jQuery的简介方式。
某些其他JavaScript库中的函数（比如Prototype）同样使用$符号。
jQuery使用名为noConflict()的方法来解决该问题。
varjq=jQuery.noConflict()，帮助您使用自己的名称（比如jq）来代替$符号。
TIY
结论
由于jQuery是为处理HTML事件而特别设计的，那么当您遵循以下原则时，您的代码会更恰当且更易维护：
•把所有jQuery代码置于事件处理函数中
•把所有事件处理函数置于文档就绪事件处理器中
•把jQuery代码置于单独的.js文件中
•如果存在名称冲突，则重命名jQuery库
五、jQuery事件
下面是jQuery中事件函数的一些例子：
Event函数绑定函数至
$(document).ready(function)文档的就绪事件
（当HTML文档就绪可用）
$(selector).click(function)被选元素的点击事件
$(selector).dblclick(function)被选元素的双击事件
$(selector).focus(function)被选元素的获得焦点事件
$(selector).mouseover(function)被选元素的鼠标悬停事件
(selector)jQuery元素选择器
如需完整的参考手册，请访问我们的jQuery事件参考手册。
jQuery是为事件处理特别设计的。
jQuery事件函数
隐藏、显示、切换、滑动以及动画。WOW!
ClickHeretoShow/HidePanel
实例
jQueryhide()
演示简单的jQueryhide()函数。
jQueryhide()
另一个hide()演示。如何隐藏部分文本。
jQueryslideToggle()
演示简单的slidepanel效果。
jQueryfadeTo()
演示简单的jQueryfadeTo()函数。
jQueryanimate()
演示简单的jQueryanimate()函数。
jQuery隐藏和显示
通过hide()和show()两个函数，jQuery支持对HTML元素的隐藏和显示：
实例
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
TIY
hide()和show()都可以设置两个可选参数：speed和callback。
语法：
$(selector).hide(speed,callback)
$(selector).show(speed,callback)
callback参数是在hide或show函数完成之后被执行的函数名称。您将在本教程下面的章节学习更多有关callback参数的知识。
speed参数可以设置这些值："slow","fast","normal"或milliseconds：
实例
$("button").click(function(){
$("p").hide(1000);
});
TIY
jQuery切换
jQuerytoggle()函数使用show()或hide()函数来切换HTML元素的可见状态。
隐藏显示的元素，显示隐藏的元素。
语法：
$(selector).toggle(speed,callback)
speed参数可以设置这些值："slow","fast","normal"或毫秒。
实例
$("button").click(function(){
$("p").toggle();
});
TIY
callback参数是在hide或show函数完成之后被执行的函数名称。您将在本教程下面的章节学习更多有关callback参数的知识。
jQuery滑动函数-slideDown,slideUp,slideToggle
jQuery拥有以下滑动函数：
$(selector).slideDown(speed,callback)
$(selector).slideUp(speed,callback)
$(selector).slideToggle(speed,callback)
speed参数可以设置这些值："slow","fast","normal"或毫秒。
callback参数是在hide或show函数完成之后被执行的函数名称。您将在本教程下面的章节学习更多有关callback参数的知识。
slideDown()实例
$(".flip").click(function(){
$(".panel").slideDown();
});
TIY
slideUp()实例
$(".flip").click(function(){
$(".panel").slideUp()
})
TIY
slideToggle()实例
$(".flip").click(function(){
$(".panel").slideToggle();
});
TIY
jQueryFade函数-fadeIn(),fadeOut(),fadeTo()
jQuery拥有以下fade函数：
$(selector).fadeIn(speed,callback)
$(selector).fadeOut(speed,callback)
$(selector).fadeTo(speed,opacity,callback)
speed参数可以设置这些值："slow","fast","normal"或毫秒。
fadeTo()函数中的opacity参数规定减弱到给定的不透明度。
callback参数是在hide或show函数完成之后被执行的函数名称。您将在本教程下面的章节学习更多有关callback参数的知识。
fadeTo()实例
$("button").click(function(){
$("div").fadeTo("slow",0.25);
});
TIY
fadeOut()实例
$("button").click(function(){
$("div").fadeOut(4000);
});
TIY
jQuery自定义动画
jQuery函数创建自定义动画的语法：
$(selector).animate({params},[duration],[easing],[callback])
关键的参数是params。它定义了产生动画的属性。可以同时设置多个此类属性：
animate({width:"70%",opacity:0.4,marginLeft:"0.6in",fontSize:"3em"});
第二个参数是duration。它定义用来应用于动画的时间。它设置的值是："slow","fast","normal"或毫秒。
实例1
<scripttype="text/javascript">
$(document).ready(function(){
$("#start").click(function(){
$("#box").animate({height:300},"slow");
$("#box").animate({width:300},"slow");
$("#box").animate({height:100},"slow");
$("#box").animate({width:100},"slow");
});
});
</script>
TIY
实例2
<scripttype="text/javascript">
$(document).ready(function(){
$("#start").click(function(){
$("#box").animate({left:"100px"},"slow");
$("#box").animate({fontSize:"3em"},"slow");
});
});
</script>
TIY
HTML元素默认是静态定位，且无法移动。
如需使元素可以移动，请把CSS的position设置为relative或absolute。
六、jQuery效果
函数描述
$(selector).hide()隐藏被选元素
$(selector).show()显示被选元素
$(selector).toggle()切换（在隐藏与显示之间）被选元素
$(selector).slideDown()向下滑动（显示）被选元素
$(selector).slideUp()向上滑动（隐藏）被选元素
$(selector).slideToggle()对被选元素切换向上滑动和向下滑动
$(selector).fadeIn()淡入被选元素
$(selector).fadeOut()淡出被选元素
$(selector).fadeTo()把被选元素淡出为给定的不透明度
$(selector).animate()对被选元素执行自定义动画
如需完整的参考手册，请访问我们的jQueryEffect参考手册
七、jQueryCallback函数
动画创造了对callback函数的需求。
ClickHeretoShow/HidePanel
jQuery动画的问题
许多jQuery函数涉及动画。这些函数也许会将speed或duration作为可选参数。
例子：$("p").hide("slow")
speed或duration参数可以设置许多不同的值，比如"slow","fast","normal"或毫秒。
实例
$("button").click(function(){
$("p").hide(1000);
});
TIY
由于JavaScript语句（指令）是逐一执行的-按照次序，动画之后的语句可能会产生错误或页面冲突，因为动画还没有完成。
为了避免这个情况，您可以以参数的形式添加Callback函数。
jQueryCallback函数
当动画100%完成后，即调用Callback函数。
典型的语法：
$(selector).hide(speed,callback)
callback参数是一个在hide操作完成后被执行的函数。
错误（没有callback）
$("p").hide(1000);
alert("Theparagraphisnowhidden");
TIY
正确（有callback）
$("p").hide(1000,function(){
alert("Theparagraphisnowhidden");
});
TIY
结论：如果您希望在一个涉及动画的函数之后来执行语句，请使用callback函数。
六、jQuery包含很多供改变和操作HTML的强大函数。
改变HTML内容
语法
$(selector).html(content)
html()函数改变所匹配的HTML元素的内容（innerHTML）。
实例
$("p").html("W3School");
TIY
添加HTML内容
语法
$(selector).append(content)
append()函数向所匹配的HTML元素内部追加内容。
语法
$(selector).prepend(content)
prepend()函数向所匹配的HTML元素内部预置（Prepend）内容。
实例
$("p").append("W3School");
TIY
语法
$(selector).after(content)
after()函数在所有匹配的元素之后插入HTML内容。
语法
$(selector).before(content)
before()函数在所有匹配的元素之前插入HTML内容。
实例
$("p").after("W3School.");
TIY
jQueryHTML操作-来自本页
函数描述
$(selector).html(content)改变被选元素的（内部）HTML
$(selector).append(content)向被选元素的（内部）HTML追加内容
$(selector).prepend(content)向被选元素的（内部）HTML“预置”（Prepend）内容
$(selector).after(content)在被选元素之后添加HTML
$(selector).before(content)在被选元素之前添加HTML
(selector)jQuery元素选择器语法
如需完整的参考手册，请访问我们的jQueryHTML操作参考手册。
八、jQueryCSS操作
jQuery拥有三种供CSS操作的重要函数：
•$(selector).css(name,value)
•$(selector).css({properties})
•$(selector).css(name)
CSS操作实例
函数css(name,value)为所有匹配元素的给定CSS属性设置值：
实例
$(selector).css(name,value)
$("p").css("background-color","yellow");
TIY
函数css({properties})同时为所有匹配元素的一系列CSS属性设置值：
实例
$(selector).css({properties})
$("p").css({"background-color":"yellow","font-size":"200%"});
TIY
函数css(name)返回指定的CSS属性的值：
实例
$(selector).css(name)
$(this).css("background-color");
TIY
jQuerySize操作
jQuery拥有两种供尺寸操作的重要函数：
•$(selector).height(value)
•$(selector).width(value)
Size操作实例
函数height(value)设置所有匹配元素的高度：
实例
$(selector).height(value)
$("#id100").height("200px");
TIY
函数width(value)设置所有匹配元素的宽度：
实例
$(selector).width(value)
$("#id200").width("300px");
TIY
jQueryCSS函数-来自本页
CSS属性描述
$(selector).css(name,value)为匹配元素设置样式属性的值
$(selector).css({properties})为匹配元素设置多个样式属性
$(selector).css(name)获得第一个匹配元素的样式属性值
$(selector).height(value)设置匹配元素的高度
$(selector).width(value)设置匹配元素的宽度
(selector)jQuery元素选择器语法
如需完整的参考手册，请访问我们的jQueryCSS函数参考手册。
九、jQueryAJAX
jQuery拥有供AJAX开发的丰富函数（方法）库。
jQueryAJAX实例
通过AJAX来改变文本
ChangeContent
TIY
上面的例子摘自我们的AJAX教程，但使用jQuery进行了修改。
什么是AJAX？
AJAX=AsynchronousJavaScriptandXML.
AJAX是一种创建快速动态网页的技术。
AJAX通过在后台与服务器交换少量数据的方式，允许网页进行异步更新。这意味着有可能在不重载整个页面的情况下，对网页的一部分进行更新。
您可以在我们的AJAX教程中学习更多有关AJAX的知识。
AJAX和jQuery
jQuery提供了供AJAX开发的丰富函数（方法）库。
通过jQueryAJAX，使用HTTPGet和HTTPPost，您都可以从远程服务器请求TXT、HTML、XML或JSON。
而且您可以直接把远程数据载入网页的被选HTML元素中！
写的更少，做的更多
jQuery的load函数是一种简单的（但很强大的）AJAX函数。它的语法如下：
$(selector).load(url,data,callback)
请使用选择器来定义要改变的HTML元素，使用url参数来指定您的数据的web地址。
TIY
只有当您希望向服务器发送数据，才需要使用data参数。只有当您需要在完毕之后触发一个函数时，您才需要使用callback参数。
LowLevelAJAX
$.ajax(options)是低层级AJAX函数的语法。
$.ajax提供了比高层级函数更多的功能，但是同时也更难使用。
option参数设置的是name|value对，定义url数据、密码、数据类型、过滤器、字符集、超时以及错误函数。
TIY
jQueryAJAX请求
请求描述
$(selector).load(url,data,callback)把远程数据加载到被选的元素中
$.ajax(options)把远程数据加载到XMLHttpRequest对象中
$.get(url,data,callback,type)使用HTTPGET来加载远程数据
$.post(url,data,callback,type)使用HTTPPOST来加载远程数据
$.getJSON(url,data,callback)使用HTTPGET来加载远程JSON数据
$.getScript(url,callback)加载并执行远程的JavaScript文件
(selector)jQuery元素选择器语法
(url)被加载的数据的URL（地址）
(data)发送到服务器的数据的键/值对象
(callback)当数据被加载时，所执行的函数
(type)被返回的数据的类型(html,xml,json,jasonp,script,text)
(options)完整AJAX请求的所有键/值对选项
十、通过实例增进jQuery技能！
jQuery语法实例
$(this).hide()
演示jQuery的hide()函数，隐藏当前的HTML元素。
$("p").hide()
演示jQuery的hide()函数，隐藏所有<p>元素。
$(".test").hide()
演示jQuery的hide()函数，隐藏所有class="test"的元素。
$("#test").hide()
演示jQuery的hide()函数，隐藏id="test"的元素。
例子解释
Hiding-Sliding-Fading
jQueryfadeOut()
演示简单的jQueryfadeout()函数。
jQueryhide()
演示简单的jQueryhide()函数。
Hideexplanations
演示如何隐藏部分文本。
Slidepanel
演示简单的SlidePanel效果。
jQueryanimate()
演示简单的jQueryanimate()函数。
例子解释
HTML操作
改变HTML元素的内容。
向HTML元素追加内容。
在HTML元素之后追加内容。
例子解释
CSS操作
改变HTML元素的CSS属性。
改变多个CSS属性。
获得元素的CSS属性。
例子解释
AJAX和jQuery
使用$(selector).load(url)来改变HTML内容。
使用$.ajax(options)来改变HTML内容。
例子解释
jQuery参考手册
•jQuery选择器
•jQuery事件
•jQuery效果
•jQuery文档操作
•jQuery属性
•jQueryCSS
•jQueryAjax
•jQuery遍历
•jQuery数据存储
•jQuery队列控制
•jQuery核心
1．jQuery选择器
选择器实例选取
*
$("*")所有元素
#id
$("#lastname")id=lastname的元素
.class
$(".intro")所有class="intro"的元素
element
$("p")所有<p>元素
.class.class$(".intro.demo")所有class=intro且class=demo的元素
:first
$("p:first")第一个<p>元素
:last
$("p:last")最后一个<p>元素
:even
$("tr:even")所有偶数<tr>元素
:odd
$("tr:odd")所有奇数<tr>元素
:eq(index)
$("ulli:eq(3)")列表中的第四个元素（index从0开始）
:gt(no)
$("ulli:gt(3)")列出index大于3的元素
:lt(no)
$("ulli:lt(3)")列出index小于3的元素
:not(selector)$("input:not(:empty)")所有不为空的input元素
:header
$(":header")所有标题元素<h1><h2>...
:animated
所有动画元素
:contains(text)
$(":contains('W3School')")包含文本的所有元素
:empty
$(":empty")无子（元素）节点的所有元素
:hidden$("p:hidden")所有隐藏的<p>元素
:visible
$("table:visible")所有可见的表格
s1,s2,s3$("th,td,.intro")所有带有匹配选择的元素
[attribute]
$("[href]")所有带有href属性的元素
[attribute=value]
$("[href='#']")所有href属性的值等于"#"的元素
[attribute!=value]
$("[href!='#']")所有href属性的值不等于"#"的元素
[attribute$=value]
$("[href$='.jpg']")所有href属性的值包含".jpg"的元素
:input
$(":input")所有<input>元素
:text
$(":text")所有type="text"的<input>元素
:password
$(":password")所有type="password"的<input>元素
:radio
$(":radio")所有type="radio"的<input>元素
:checkbox
$(":checkbox")所有type="checkbox"的<input>元素
:submit
$(":submit")所有type="submit"的<input>元素
:reset
$(":reset")所有type="reset"的<input>元素
:button
$(":button")所有type="button"的<input>元素
:image
$(":image")所有type="image"的<input>元素
:file
$(":file")所有type="file"的<input>元素
:enabled
$(":enabled")所有激活的input元素
:disabled
$(":disabled")所有禁用的input元素
:selected
$(":selected")所有被选取的input元素
:checked
$(":checked")所有被选中的input元素
2．jQuery事件
事件方法会触发匹配元素的事件，或将函数绑定到所有匹配元素的某个事件。
触发实例：
$("button#demo").click()
上面的例子将触发id="demo"的button元素的click事件。
绑定实例：
$("button#demo").click(function(){$("img").hide()})
上面的例子会在点击id="demo"的按钮时隐藏所有图像。
方法描述
ready()
文档就绪事件（当HTML文档就绪可用时）
blur()
触发、或将函数绑定到指定元素的blur事件
change()
触发、或将函数绑定到指定元素的change事件
click()
触发、或将函数绑定到指定元素的click事件
dblclick()
触发、或将函数绑定到指定元素的doubleclick事件
error()
触发、或将函数绑定到指定元素的error事件
focus()
触发、或将函数绑定到指定元素的focus事件
keydown()
触发、或将函数绑定到指定元素的keydown事件
keypress()
触发、或将函数绑定到指定元素的keypress事件
keyup()
触发、或将函数绑定到指定元素的keyup事件
load()触发、或将函数绑定到指定元素的load事件
mousedown()
触发、或将函数绑定到指定元素的mousedown事件
mouseenter()
触发、或将函数绑定到指定元素的mouseenter事件
mouseleave()
触发、或将函数绑定到指定元素的mouseleave事件
mousemove()
触发、或将函数绑定到指定元素的mousemove事件
mouseout()
触发、或将函数绑定到指定元素的mouseout事件
mouseover()
触发、或将函数绑定到指定元素的mouseover事件
mouseup()
触发、或将函数绑定到指定元素的mouseup事件
resize()
触发、或将函数绑定到指定元素的resize事件
scroll()
触发、或将函数绑定到指定元素的scroll事件
select()
触发、或将函数绑定到指定元素的select事件
submit()
触发、或将函数绑定到指定元素的submit事件
unload()触发、或将函数绑定到指定元素的unload事件
jQuery事件处理方法
事件处理方法把事件处理器绑定至匹配元素。
方法触发
$(selector).bind(event)向匹配元素添加一个或更多事件处理器
$(selector).delegate(selector,event)向匹配元素添加一个事件处理器，现在或将来
$(selector).die()移除所有通过live()函数添加的事件处理器
$(selector).live(event)向匹配元素添加一个事件处理器，现在或将来
$(selector).one(event)向匹配元素添加一个事件处理器。该处理器只能触发一次。
$(selector).unbind(event)从匹配元素移除一个被添加的事件处理器
$(selector).undelegate(event)从匹配元素移除一个被添加的事件处理器，现在或将来
$(selector).trigger(event)
所有匹配元素的指定事件
$(selector).triggerHandler(event)第一个被匹配元素的指定事件
3．jQuery效果
jQuery效果函数
Hide/Show描述
show()
显示被选的元素
hide()
隐藏被选的元素
toggle()
对被选元素进行隐藏和显示的切换
Slide
slideDown()
通过调整高度来滑动显示被选元素
slideUp()
通过调整高度来滑动隐藏被选元素
slideToggle()
对被选元素进行滑动隐藏和滑动显示的切换
Fadein/out
fadeIn()
淡入被选元素至完全不透明
fadeOut()
淡出被选元素至完全不透明
fadeTo()
把被选元素减弱至给定的不透明度
Animation
animate()
对被选元素应用“自定义”的动画
stop()
停止在被选元素上运行动画
Queue
clearQueue()
对被选元素移除所有排队的函数（仍未运行的）
delay()对被选元素的所有排队函数（仍未运行）设置延迟
dequeue()运行被选元素的下一个排队函数
queue()显示被选元素的排队函数
4．jQuery文档操作
jQuery文档操作方法
这些方法对于XML文档和HTML文档均是适用的，除了：html()。
方法描述
addClass()
向匹配的元素添加指定的类名。
after()
在匹配的元素之后插入内容。
5．jQuery属性
jQuery属性操作方法
下面列出的这些方法获得或设置元素的DOM属性。
这些方法对于XML文档和HTML文档均是适用的，除了：html()。
方法描述
addClass()
向匹配的元素添加指定的类名。
attr()
设置或返回匹配元素的属性和值。
hasClass()
检查匹配的元素是否拥有指定的类。
html()
设置或返回匹配的元素集合中的HTML内容。
removeAttr()
从所有匹配的元素中移除指定的属性。
removeClass()
从所有匹配的元素中删除全部或者指定的类。
toggleClass()
从匹配的元素中添加或删除一个类。
val()
设置或返回匹配元素的值。
注释：jQuery文档操作参考手册中也列出了以上方法。本参考页的作用是方便用户单独查阅有关属性操作方面的方法。
6．jQueryCSS
jQueryCSS操作函数
下面列出的这些方法设置或返回元素的CSS相关属性。
CSS属性描述
css()
设置或返回匹配元素的样式属性。
height()
设置或返回匹配元素的高度。
offset()
返回第一个匹配元素相对于文档的位置。
offsetParent()
返回最近的定位祖先元素。
position()
返回第一个匹配元素相对于父元素的位置。
scrollTop()
设置或返回匹配元素相对滚动条顶部的偏移。
scrollLeft()
设置或返回匹配元素相对滚动条左侧的偏移。
width()
设置或返回匹配元素的宽度。
7．jQueryAjax
jQueryAjax操作函数
jQuery库拥有完整的Ajax兼容套件。其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据。
函数描述
jQuery.ajax()
执行异步HTTP(Ajax)请求。
.ajaxComplete()当Ajax请求完成时注册要调用的处理程序。这是一个Ajax事件。
.ajaxError()当Ajax请求完成且出现错误时注册要调用的处理程序。这是一个Ajax事件。
.ajaxSend()在Ajax请求发送之前显示一条消息。
jQuery.ajaxSetup()设置将来的Ajax请求的默认值。
.ajaxStart()当首个Ajax请求完成开始时注册要调用的处理程序。这是一个Ajax事件。
.ajaxStop()当所有Ajax请求完成时注册要调用的处理程序。这是一个Ajax事件。
.ajaxSuccess()当Ajax请求成功完成时显示一条消息。
jQuery.get()使用HTTPGET请求从服务器加载数据。
jQuery.getJSON()使用HTTPGET请求从服务器加载JSON编码数据。
jQuery.getScript()使用HTTPGET请求从服务器加载JavaScript文件，然后执行该文件。
.load()从服务器加载数据，然后把返回到HTML放入匹配元素。
jQuery.param()创建数组或对象的序列化表示，适合在URL查询字符串或Ajax请求中使用。
jQuery.post()使用HTTPPOST请求从服务器加载数据。
.serialize()将表单元素集合作为提交的字符进行编码。
.serializeArray()将表单元素集合作为数据的名称和值进行编码。
8．jQuery遍历
jQuery遍历函数
jQuery遍历函数包括了用于筛选、查找和串联元素的方法。
函数描述
.add()将元素添加到匹配元素的集合中。
.andSelf()把堆栈中之前的元素集添加到当前集合中。
.children()获得匹配元素集合中每个元素的所有子元素。
.closest()从元素本身开始，逐级向上级元素匹配，并返回最先匹配的祖先元素。
.contents()获得匹配元素集合中每个元素的子元素，包括文本和注释节点。
.each()对jQuery对象进行迭代，为
9．jQuery数据存储
jQuery数据存储函数
这些方法允许我们将指定的DOM元素与任意数据相关联。
函数描述
.data()存储与匹配元素相关的任意数据。
jQuery.data()存储与指定元素相关的任意数据。
.removeData()移除之前存放的数据。
jQuery.removeData()移除之前存放的数据。
10．jQuery队列控制
jQuery队列控制函数
函数描述
.clearQueue()从队列中删除所有未运行的项目。
.dequeue()从队列最前端移除一个队列函数，并执行它。
jQuery.dequeue()从队列最前端移除一个队列函数，并执行它。
.queue()显示或操作匹配元素所执行函数的队列。
jQuery.queue()显示或操作匹配元素所执行函数的队列。
11．jQuery核心
JQUERY核心函数
函数描述
jQuery()
接受一个字符串，其中包含了用于匹配元素集合的CSS选择器。
jQuery.noConflict()
运行这个函数将变量$的控制权让渡给第一个实现它的那个库。