jquery与ajax的引用

Ajax的优势：不需要插件支持。优秀的用户体验。提供web程序性能。减轻服务器和带宽负担。

Ajax的不足：浏览器对XMLHttpRequest的支持不足。破坏浏览器的前进后退功能。对搜索引擎的支持不足。开发和调试工具的缺乏。

js的Ajax例子：

function  ajax(){   var xmlHttpReq=null;   if(window.ActiveXObject){       xmlHttpReq=new Active XObject("Microsoft.XMLHTTP");    }else if(window.XmlHttpRequest){       xmlHttpReq=new XmlHttpRequest();   }   xmlHttpReq.open("GET","url',true);   xmlHttpReq.send(null);   if(xmlHttpReq.readyState==4){      if(xmlHttpReq.state==200){          alert(xmlHttpReq.responseText());      }   }}

jQuery中的Ajax例子

1.load()

1.1载入html文档

load(url[,data][,callback])

url：请求html页面的url地址

data:可选，发送到服务器额key/value数据

callback：可选，请求完成时的回调函数，无论请求成功失败

<div id="text"></div>$("#text").load("test.html")//加载test.html页面，加载并插入到div中

1.2筛选载入的html文档

url==url selector，可以用选择起来选择载入的内容

$("#text").load("test.html  .hello")//载入test.html中class为hello的的内容

1.3传递方式

     没有data就是get，有data就是post
1.4回调函数

function(responseText，textStatus，XMLHttpRequest){

//responseText:请求返回的内容

//textStatus:请求状态，success,error,timeout,notmodified4种

//XmlHttpRequest：XMLHttpRequest对象。

}

2.$.get()和$.post()

2.1$.get()

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

url：请求地址

data：可选，发送到服务器的数据，会做为QueryString附加到请求url中

callback:可选，载入成功是执行的函数

type:可选，服务器返回的内容格式，xml，json，html。

回调函数：

function(data,textStatus){

//data:返回的数据

//textStatus：4种状态

}

2.2$.post

和$.get的区别：

1.GET请求见参数附加在url后进行传输，POST请求则是作为HTTP消息的实体内容发送给服务器，Ajax中对用户不可见

2.GET请求对数据有大小限制，POST方式传递方式要大的多

3.GET方式请求的数据会被浏览器缓存起来，用户浏览历史记录中可以读到数据，所以会有安全问题。

3.$.getScript()和$.getJson()

$.getScript()不用全部加载所有的js文件，有些文件用到时在加载就行了

$.getScript("../js/hello.js",function(){})

$.getJson()用来加载json文件

$.getJson("text.json",function(data){})

4.$.ajax()

$.ajax(options)只有一个参数

内容为：

1.url:请求地址，默认当前页地址

2.type:请求方式，默认get

2.timeout:设置超时时间，会覆盖$.ajaxSetup()中的配置

3.data:发送给服务端的数据，

4.dataType:预期服务器返回的数据类型，jsonp格式：xxx?callback=?时，jquery会替换最后一个？为正确的函数名，用来执行回调函数。

5.beforeSend:发送请求是可以修改XMLHttpRequest对象的函数。返回false可以取消请求。

6.complete:请求完成后调用的函数，不管成功失败。

7.success:请求成功后调用的函数，data和textStatus

8.errot：请求失败后调用的函数，XMLHttpRequest,textStatus,errorThrown

9.global:默认为true,是否触发全局Ajax事件

$.ajax({   url:"/xxx",   type:"get",   data:{},   success:function(data){   }})

序列化元素

1.serialize()

如果表单数据多，可以使用$("#form").serialize()，会把值变为字符串格式。会自动编码。

2.serializeArray()

不是返回数组，而是返回json数据

3.$.param()

用来将一个数组和对象按照key/value序列化

全局事件

ajax开始时会触发ajaxStart(function(){}),

结束时会触发ajaxStop(function(){})。

ajaxComplete(callBack)：完成时执行

ajaxError(callback):ajax错误时执行

ajaxSend(callback)：ajax发送请执行

ajaxSuccess(callback):ajax成功时执行

无论定义在哪里，只要有ajax请求就会执行。