jquery之数据传输

上篇讲完了get与post的区别，现在开始就将jquery（web）对于这两种协议以及其他获取数据的方法。
一提传输数据，ajax大家必不陌生，今天也主要是将jquery对ajax封装的几种常见方法，其中$.ajax()是属于最底层的方法，$.load(),$.get(),$.post()是第二层的方法，而$.getScript()和$.getJSON()属于第三层的方法。

以前都是用$.ajax()来解决所有数据的交互，发现这样效率不够而且代码量大，适当的用一下这些上层的方法也是不错的。

一.$(element).load()
一般加载的都是静态文件；
以为很简单的呢，第一脚就踩到坑里了，load()不可以加载本地文件的，有人说是windows的安全机制导致的，另一方面应该封装的时候就是跟服务器响应的吧。
而且，载入的应该仅仅是数据，而非像iframe似得整个结构。
1.载入HTML文档

$(element).load(url[,data][,callback])

注意：data和回调函数都是可选的
url:不必说，请求的地址
data:发送到服务器的key/value数据
callback:请求完成后的回调函数，无论请求成功还是失败
例：$("#content").load("demo.html",{"id":"1","name":"cc"},function(){
})
2.筛选载入的HTML文档的一部分
$(element).load("url selector")
$("#content").load("demo.html .content ",{"id":"1","name":"cc"},function(){
})
3.传递方式
当data为空是默认为get方式，而不为空时默认是post
4.回调参数
$("#content").load("demo.html .content ",{"id":"1","name":"cc"},function(responseText,testStatus,XMLHttpRequest){
//responsetText: 返回的内容
//textStatus:请求状态：success/error/notmodified/timeout
//XMLHttpRequest:XMLHttpRequest对象
})
二.$.get()

$.get(url[,data][,callback][,type])

url:不必说，请求的地址
data:发送到服务器的key/value数据
callback:载入成功时回调函数，注意与load的区别。只有请求结果和状态两个参数
type:服务器端返回内容的格式：xml/html/script/json/text/_default

主要需要注意的是解析各种格式数据的方法，这儿就不细讲了。
三。$.post()
跟$.get()的使用方式都类似，它两传输方式的不同点上篇博客已经介绍到了。

上面三个方法完成常规的ajax程序没问题，但是复杂的一些ajax程序，就需要用到$.ajax()方法了。其不仅能够实现上述三种功能，而且还设定了许多回调函数来处理不同的情况。
四、$.ajax()
$.ajax(options)
其只有一个参数，将所有的参数和对调函数封装到一个对象里，参数都一key/value形式存在，所有参数都是可选的
ajax()提供了一大票参数，所以可以实现相当复杂的功能。

参数名 类型 描述
url String (默认: 当前页地址) 发送请求的地址。
type String (默认: “GET”) 请求方式 (“POST” 或 “GET”)， 默认为 “GET”。
注意：其它 HTTP 请求方法，如 PUT 和 DELETE 也可以使用，但仅部分浏览器支持。
timeout Number 设置请求超时时间（毫秒）。此设置将覆盖全局设置。
async Boolean (默认: true) 默认设置下，所有请求均为异步请求。
如果需要发送同步请求，请将此选项设置为 false。
注意，同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行。
beforeSend Function 发送请求前可修改 XMLHttpRequest 对象的函数，如添加自定义 HTTP 头。
XMLHttpRequest 对象是唯一的参数。
function (XMLHttpRequest) { this; // the options for this ajax request } function (XMLHttpRequest) { this; // the options for this ajax request }

cache Boolean (默认: true) jQuery 1.2 新功能，设置为 false 将不会从浏览器缓存中加载请求信息。
complete Function 请求完成后回调函数 (请求成功或失败时均调用)。
参数： XMLHttpRequest 对象，成功信息字符串。
function (XMLHttpRequest, textStatus) { this; // the options for this ajax request } function (XMLHttpRequest, textStatus) { this; // the options for this ajax request }
contentType String (默认: “application/x-www-form-urlencoded”) 发送信息至服务器时内容编码类型。默认值适合大多数应用场合。
data Object,
String 发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。
查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。
如果为数组，jQuery 将自动为不同值对应同一个名称。
如 {foo:[“bar1”, “bar2”]} 转换为 ‘&foo=bar1&foo=bar2′。
dataType String 预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息
返回 responseXML 或 responseText，并作为回调函数参数传递，可用值:
“xml”: 返回 XML 文档，可用 jQuery 处理。
“html”: 返回纯文本 HTML 信息；包含 script 元素。
“script”: 返回纯文本 JavaScript 代码。不会自动缓存结果。
“json”: 返回 JSON 数据 。
“jsonp”: JSONP 格式。使用 JSONP 形式调用函数时，
如 “myurl?callback=?” jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。
error Function (默认: 自动判断 (xml 或 html)) 请求失败时将调用此方法。
这个方法有三个参数：XMLHttpRequest 对象，错误信息，（可能）捕获的错误对象。
function (XMLHttpRequest, textStatus, errorThrown) { // 通常情况下textStatus和errorThown只有其中一个有值 this; // the options for this ajax request } function (XMLHttpRequest, textStatus, errorThrown) { // 通常情况下textStatus和errorThown只有其中一个有值 this; // the options for this ajax request }
global Boolean (默认: true) 是否触发全局 AJAX 事件。设置为 false 将不会触发全局 AJAX 事件，
如 ajaxStart 或 ajaxStop 。可用于控制不同的Ajax事件
ifModified Boolean (默认: false) 仅在服务器数据改变时获取新数据。
使用 HTTP 包 Last-Modified 头信息判断。
processData Boolean (默认: true) 默认情况下，发送的数据将被转换为对象(技术上讲并非字符串)
以配合默认内容类型 “application/x-www-form-urlencoded”。
如果要发送 DOM 树信息或其它不希望转换的信息，请设置为 false。
success Function
请求成功后回调函数。这个方法有两个参数：服务器返回数据，返回状态
function (data, textStatus) { // data could be xmlDoc, jsonObj, html, text, etc… this; // the options for this ajax request } function (data, textStatus) { // data could be xmlDoc, jsonObj, html, text, etc… this; // the options for this ajax request }

五、$.getScript()
顾名思义，动态加载script文件，也可以加上回调函数来处理其他操作。
六、$.getJSON()
动态加载json文件

附：jsonp的操作可以找我以前的博客去看看，应该讲的很清楚了。

七、序列化元素
1.serialize()方法
将dom元素内容序列化为字符串，用于传输的data，需要注意的是，传输的时候就不需要键值对形式了，直接写序列化后的数据就可以了。
另外，不只有form可以序列化，其它选择器选择的元素也可以用到它。
2.serializeArray()方法
不同于上面转化为string，而是直接转化为json对象
3.$.prarm()
它其实是serialize()方法的核心，对一个数组或对象进行序列化。
例：

var obj = {a:1,b:2,c:3}var k = $.param(obj);alert(k) //输出a=1&b=2&c=3

八、其它
jquery还根据ajax定义了一些其它有意思的全局回调函数。有：
ajaxStart(callback)、ajaxStop(callback)、ajaxComplete(callback)、ajaxError(callback)、ajaxSend(callback)、ajaxSuccess(callback)。

因为这些函数是全局函数，因此只要该页面进行ajax操作时就有效

举个例子：

<div class="loading"></div>$(".loading").ajaxStart(function(){    $(this).show();});$(".loading").ajaxStop(function(){    $(this).hide();});

以前还真没用过这些方法，写了好多没用的代码，以后有机会可以用一下。

写了好多了，中间要有打错的地方大家提醒一下，孰能无过？嘻嘻。