jQuery技术第二讲

简述：其实学习jQuery与其他的框架比起来比较轻松。因为它是一个比较轻巧的成熟的框架。在学习完javaScript之后，感觉只要需要实现效果等，尽量学会查api就行，也提供了翻译的api，大家可以查询并来完成自己的功能。
一、事件
a) 页面载入
Ready(fn)，当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。当窗体加载完毕后，触发fn的函数
b) 事件处理
Bind(type,[data],fn)为每个匹配元素的特定事件绑定事件处理函数。例：$("div").bind("click",function(){});
one(type,[data],fn)为每一个匹配元素的特定事件（像click）绑定一个一次性的事件处理函数。 该事件的处理只会被执行一次
Trigger(type,[data]) 在每一个匹配的元素上触发某类事件。比如表单的提交triggerHandler(type,[data]) 这个特别的方法将会触发指定的事件类型上所有绑定的处理函数。但不会执行浏览器默认动作，也不会产生事件冒泡。
这个方法的行为表现与trigger类似，但有以下三个主要区别：
* 第一，他不会触发浏览器默认事件。
* 第二，只触发jQuery对象集合中第一个元素的事件处理函数。
* 第三，这个方法的返回的是事件处理函数的返回值，而不是据有可链性的jQuery对象。此外，如果最开始的jQuery对象集合为空，则这个方法返回 undefined 。
Unbind([type],[fn])bind()的反向操作，从每一个匹配的元素中删除绑定的事件。
c) 事件委托
Live(type,[data],function(){})jQuery 给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效。
Die([type],[fn])此方法与live正好完全相反。就删除委托的事件
d) 事件切换
Hover(over,out) 一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。这是一个自定义的方法，它为频繁使用的任务提供了一种“保持在其中”的状态。当鼠标移动到这个元素上则会触发over这个函数，当鼠标离开的时候触发out
Toggle(fn,fn2,fn3....)每次点击后依次调用函数。当鼠标点击第一次触发第一个函数，点击第二次触发第二个函数，点击第三触发第三个，依次往下....
e) 事件
Blur() 触发每一个匹配元素的blur事件。这就与上面的bind方法所联系，当你指定了这个类型的事件后，调用其方法就执行了。
Blur(fn) 触发每一个匹配元素的blur事件，调用fn这个函数。则不会调用bind指定的函数
Click.change,dblclick,error,focus等事件类型，详情可以查api的事件类型
二、效果
a) 基本
Show() 显示隐藏的匹配元素。一般的显示。
Show(speed,[fn]) 当然jQuery也可以实现了效果 可以优雅的显示，speed指定的毫秒数，当然也可以指定相应指定的速度 ("slow", "normal", or "fast")  fn参数可选，就是当元素显示出来之后执行的函数
Hide()隐藏显示的元素
Hide(speed,[fn]) 与show的参数意义相同
Toggle()切换元素的可见状态。如果元素是可见的，切换为隐藏的；如果元素是隐藏的，切换为可见的。
Toggle(switch) 当参数设置为true的时候为可见，false为隐藏
toggle(speed,[fn])与show的参数意义相同
b) 滑动
slideDown(speed,[fn]) 在show方法指定了效果，是从左上角缓慢想右下角出现显示的效果，这个效果是从顶部缓慢平铺下底部的显示效果,参数与上相同
slideUp(speed,[fn]) 从底部缓慢向上部消失的效果
slideToggle(speed,[fn]) 与上的toggle方法相同，只是效果不同，效果是上两个方法的滑动效果
c) 淡入淡出
fadeIn(speed,[fn]) 通过控制透明度的方式来实现显示的效果。
fadeOut(speed,[fn]) 通过控制透明度的方式来实现隐藏的效果。fadeTo(speed,opacity,[fn]) 把所有匹配元素的不透明度以渐进方式调整到指定的不透明度，并在动画完成后可选地触发一个回调函数。Opacity参数：要调整到的不透明度值(0到1之间的数字).
d) 自定义
Animate(params,[duration]),[easing],[fn])用于创建自定义动画的函数。Params:一组包含作为动画属性和终值的样式属性和及其值的集合 duration：三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如：1000) easing：要使用的擦除效果的名称(需要插件支持).默认jQuery提供"linear" 和 "swing".
Animate(params,options) 用于创建自定义动画的函数。Options：一组包含动画选项的值的集合。选项为：duration，easing，complete：在动画完成时执行的函数，queue：(默认值: true) 设定为false将使此动画不进入动画队列 
Stop([clearQueue],[gotoEnd])停止所有在指定元素上正在运行的动画。clearQueue:如果设置成true，则清空队列。可以立即结束动画。gotoEnd 让当前正在执行的动画立即完成，并且重设show和hide的原始样式，调用回调函数等
Delay(duration,[queueName])  设置一个延时来推迟执行队列中之后的项目。Duration:延时时间，单位：毫秒 queueName 队列名词，默认是Fx，动画队列。例子：$('#foo').slideUp(300).delay(800).fadeIn(400); 
e) 设置
jQuery.fx.off 关闭页面上所有的动画。该值如果为true表示禁用  jQuery.fx.off = true;
三、Ajax
a) Ajax
jQuery.ajax(options)可以指定一个对象，它会根据指定的属性值来请求后台并执行函数等options的选项：
async：是否采用异步处理 
beforeSend(xhr) 发送请求前可修改 XMLHttpRequest 对象的函数，如添加自定义 HTTP 头。XMLHttpRequest 对象是唯一的参数。这是一个 Ajax 事件。如果返回false可以取消本次ajax请求。
Cache: 缓存，(默认: true,dataType为script和jsonp时默认为false) 设置为 false 将不缓存此页面。
Complete(xhr,ts)请求完成后回调函数 (请求成功或失败之后均调用)。参数：XMLHttpRequest 对象和一个描述成功请求类型的字符串。
contentType：(默认: "application/x-www-form-urlencoded") 发送信息至服务器时内容编码类型。默认值适合大多数情况。如果你明确地传递了一个content-type给 $.ajax() 那么他必定会发送给服务器（即使没有数据要发送）
Context：这个对象用于设置Ajax相关回调函数的上下文。也就是说，让回调函数内this指向这个对象（如果不设定这个参数，那么this就指向调用本次AJAX请求时传递的options参数）。比如指定一个DOM元素作为context参数，这样就设置了success回调函数的上下文为这个DOM元素
Data：发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组，jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。
dataFilter：给Ajax返回的原始数据的进行预处理的函数。提供data和type两个参数：data是Ajax返回的原始数据，type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
dataType：预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断，比如XML MIME类型就被识别为XML。"xml":，"html","script","json","jsonp":JSONP 格式。使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。"text": 返回纯文本字符串
Error:(默认: 自动判断 (xml 或 html)) 请求失败时调用此函数。有以下三个参数：XMLHttpRequest 对象、错误信息、（可选）捕获的异常对象。如果发生了错误，错误信息（第二个参数）除了得到null之外，还可能是"timeout", "error", "notmodified" 和 "parsererror"。
Global:(默认: true) 是否触发全局 AJAX 事件。设置为 false 将不会触发全局 AJAX 事件，如 ajaxStart 或 ajaxStop 可用于控制不同的 
ifModified (默认: false) 仅在服务器数据改变时获取新数据。使用 HTTP 包 Last-Modified 头信息判断
Jsonp:在一个jsonp请求中重写回调函数的名字。这个值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分，比如{jsonp:'onJsonPLoad'}会导致将"onJsonPLoad=?"传给服务器。
jsonpCallback:为jsonp请求指定一个回调函数名。这个值将用来取代jQuery自动生成的随机函数名。这主要用来让jQuery生成度独特的函数名，这样管理请求更容易，也能方便地提供回调函数和错误处理。你也可以在想让浏览器缓存GET请求的时候，指定这个回调函数名。
Password:用于响应HTTP访问认证请求的密码
processData:(默认: true) 默认情况下，通过data选项传递进来的数据，如果是一个对象(技术上讲只要不是字符串)，都会处理转化成一个查询字符串，以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息，请设置为 false。
scriptCharset:只有当请求时dataType为"jsonp"或"script"，并且type是"GET"才会用于强制修改charset。通常只在本地和远程的内容编码不同时使用。
Success:请求成功后的回调函数。参数：由服务器返回，并根据dataType参数进行处理后的数据；描述状态的字符串。
traditional如果你想要用传统的方式来序列化数据，那么就设置为true。请参考工具分类下面的jQuery.param 方法。
Timeout:设置请求超时时间（毫秒）。此设置将覆盖全局设置。
Type:(默认: "GET") 请求方式 ("POST" 或 "GET")， 默认为 "GET"。注意：其它 HTTP 请求方法，如 PUT 和 DELETE 也可以使用，但仅部分浏览器支持。Url (默认: 当前页地址) 发送请求的地址。
Username:用于响应HTTP访问认证请求的用户名
Xhr:需要返回一个XMLHttpRequest 对象。默认在IE下是ActiveXObject 而其他情况下是XMLHttpRequest 。用于重写或者提供一个增强的XMLHttpRequest 对象。
load(url, [data],[fn]) 载入远程 HTML 文件代码并插入至 DOM 中。例如：$("#feeds").load("feeds.html");
jQuery.get(url, [data],[fn],type) 通过远程 HTTP GET 请求载入信息。此函数就是把ajax方法指定好参数并使用get方式请求，type指定响应的数据类型
jQuery.getJSON(url, [data],[fn]）通过 HTTP GET 请求载入 JSON 数据。
jQuery.getScript(url, [data],[fn]）通过 HTTP GET 请求载入并执行一个 JavaScript 文件。
jQuery.post（url, [data],[fn],type) 通过远程 HTTP POST 请求载入信息
b) Ajax事件
ajaxComplete(fn)  AJAX 请求完成时执行函数。Ajax 事件。
ajaxError(fn) AJAX 请求发生错误时执行函数。Ajax 事件。
ajaxSend(fn) AJAX 请求发送前执行函数。Ajax 事件。
ajaxStart(fn) AJAX 请求开始时执行函数。Ajax 事件。
ajaxStop(fn) AJAX 请求结束时执行函数。Ajax 事件
ajaxSuccess(fn) AJAX 请求成功时执行函数。Ajax 事件
c) 其它
jQuery.ajaxSetup([options]) 设置全局 AJAX 默认选项。参数就可以设置ajax方法中的参数
Serialize()  序列表表格内容为字符串
serializeArray()  序列化表格元素 (类似 '.serialize()' 方法) 返回 JSON 数据结构数据
四、工具
a) 数组和对象操作
jQuery.each(obj,[fn]) 通用例遍方法，可用于例遍对象和数组。
jQuery.extend([deep], target, object1, [objectN])用一个或多个其他对象来扩展一个对象，返回被扩展的对象。deep 如果设为true，则递归合并  target  待修改对象 object1 待合并到第一个对象的对象 objectN 待合并到第一个对象的对象
jQuery.grep(array, callback,[invert ])使用过滤函数过滤数组元素。此函数至少传递两个参数：待过滤数组和过滤函数。过滤函数必须返回 true 以保留元素或 false 以删除元素。Array 待过滤数组 callback 此函数将处理数组每个元素。第一个参数为当前元素，第二个参数而元素索引值。此函数应返回一个布尔值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素，i 代表元素索引值。如“a > 0”代表“function(a){ return a > 0; }"  invert 如果 "invert" 为 false 或为设置，则函数返回数组中由过滤函数返回 true 的元素，当"invert" 为 true，则返回过滤函数中返回 false 的元素集
jQuery.makeArray(obj) 将类数组对象转换为数组对象
jQuery.map(array, fn) 将一个数组中的元素转换到另一个数组中
jQuery.inArray(value, array)  确定第一个参数在数组中的位置，从0开始计数(如果没有找到则返回 -1 )
jQuery.toArray() 把jQuery集合中所有DOM元素恢复成一个数组
jQuery.merge(first, second) 合并两个数组 first 第一个待处理数组，会改变其中的元素
jQuery.unique(array)  删除数组中重复元素。只处理删除DOM元素数组，而不能处理字符串或者数字数组
jQuery.parseJSON(json) 接受一个JSON字符串，返回解析后的对象
b) 函数操作
jQuery.noop 一个空函数  当你仅仅想要传递一个空函数的时候，就用他吧。这对一些插件作者很有用，当插件提供了一个可选的回调函数接口，那么如果调用的时候没有传递这个回调函数，就用jQuery.noop来代替执行
jQuery.proxy(function, scope) 返回一个新函数，并且这个函数始终保持了特定的作用域。
c) 测试操作
jQuery.contains(container, contained)  一个DOM节点是否包含另一个DOM节点Container:DOM元素作为容器，可以包含其他元素 contained DOM节点，可能被其他元素所包含
jQuery.isArray(obj)  测试对象是否为数组
jQuery.isFunction(obj) 测试对象是否为函数
jQuery.isEmptyObject(obj) 测试对象是否是空对象（不包含任何属性)
jQuery.isPlainObject(obj)  测试对象是否是纯粹的对象（通过 "{}" 或者 "new Object" 创建的).
d) 字符串操作
jQuery.trim(str) 去掉字符串起始和结尾的空格
e) URL
jQuery.param(obj,[traditional])  将表单元素数组或者对象序列化。是.serialize()的核心方法。
f) 插件编写
jQuery.error(message)  接受一个字符串，并且直接抛出一个包含这个字符串的异常。