jQuery与Ajax(二)

1.jQuery中的AJAX服务器端返回方式

目前支持的数据类型有：Text，XML，HTML，Script，JSON，Jsonp格式。下面将分别介绍使用ajax函数接受服务器端返回这些数据类型时的处理方式。

①html方式

html方式是jQuery中在进行AJAX请求时的默认方式。如果返回的html代码中有javascript代码,用 html(),append()这些函数将返回的html代码装载到当前页面的时候才会执行其中包含的javascript代码,并且该代码只执行一次并 不缓存。

ajax()函数html方式页面

$("#ajax1").click(function(){$.ajax({url:"ajax.htm",dataType:"Html"

,success:function(data){$("#1").append(data)}})

})

ajax.htm

    

    

    

②text方式

与html方式很像，它们都是返回一个String对象

ajax()函数text方式页面

$("#ajax2").click(function(){$.ajax({url:"ajax.txt",dataType:"Text"

,success:function(data){$("#1").append(data)}})

})

ajax.txt

这里是一个文本文件

③xml方式

xml方式返回的是一个XML对象,如果被请求的XML写得不正确或不完整,jQuery会抛出一个异常,AJAX请求被强制终止。

这里只提一些关于javaScript中创建XML文档对象模型的问题,首先不同浏览器创建XML文档对象的方式不同,常规如下:

⑴function loadXML(xmlpath){                              根据不同浏览器创建xml文档对象模型

var xmlDoc=null;

if(window.ActiveXObject){       IE内核浏览器

xmlDoc=new ActiveXObject("Microsoft.XMLDOM");

}else if(document.implementation&&document.implementation.createDocument){ 非IE内核浏览器

xmlDoc=document.implementation.createDocument("","",null);

}else{alert("你的浏览器不能处理该脚本");}

xmlDoc.async=false;

xmlDoc.load(xmlpath);

return xmlDoc;

}

但起码在chrome下会抛出Object # has no method 'loas'的异常,可以改成如下:

⑵function loadXML(xmlpath){

var xmlDoc=null;

if(window.ActiveXObject){

xmlDoc=new ActiveXObject("Microsoft.XMLDOM");

xmlDoc.async=false;

xmlDoc.load(xmlpath);

}else if(document.implementation&&document.implementation.createDocument){ //非IE内核浏览器

var xmlhttp=new window.XMLHttpRequest();

xmlhttp.open("GET",xmlpath,false);

xmlhttp.send(null);

xmlDoc=xmlhttp.respon***ML;

}else{alert("你的浏览器不能处理该脚本");}

return xmlDoc;  返回的是xml文档对象,不是xml字符串

}

⑶$.ajax({url:"ajax.xml",type:"GET",dataType:"XML",success:function(xmlDoc){

alert(xmlDoc);   返回的是xml字符串,不是xml文档对象

}})

④script方式

这种方式在前面的$.getScript()函数中有讲过

script方式严格意义上不属于AJAX范畴,属于浏览器对含有src属性标签的二次请求原理,这里的标签指的就是script标签。原理是在 head中创建一个script标签,src属性就是url,浏览器自动加载javaScript文件,并执行该文件的内容,而且对该文件不作缓存,只执 行一次。

需要注意的是script方式并不是真正意义上的AJAX，所以jQuery定义的全局AJAX事件并不能完全触发,只能触发两个事件:ajaxSuccess和ajaxComplete

⑤json方式

JSON(javaScript Object Natation)是一种轻量级,基于文本,语言无关的数据交换格式,它是从ECMAScript语言标准衍生而来的。

前面在使用$.get()函数获取json数据时使用了eval()函数将得到的json格式的字符串转化为json对象,而使用$.getJSON()函数貌似得到的是一个json对象而非字符串

⑥jsonp方式

jQuery支持jsonp方式,这种方式主要在跨域请求中使用。我们在后面的学习内容中会使用AJAX进行跨域操作。