Ajax（二）数据格式

数据格式提要

在服务器端AJAX是一门与语言无关的技术。
从服务器端接收数据的时候，那些数据必须以浏览器能够理解的格式来发送。服务器端的编程语言只能以如下三种格式返回数据：

• XML
• JSON
• HTML

HTML小结

优点：

• 从服务器端发送的HTML代码在浏览器端不需要用JavaScript进行解析。
• HTML的可读性好
• HTML代码块与innerHTML属性搭配，效率高。

缺点：

• 若需要通过Ajax更新一篇文档的多个部分，HTML不合适。
• innerHTML并非DOM标准。
  代码示例：

document.getElementsByTagName("a")[0].onclick=function(){
		var request=new XMLHttpRequest();
		var url=this.href;
		var method="GET";
		request.open(method,url);
		request.send(null);
		request.onreadystatechange=function(){
			if(request.readyState==4){
				if(request.status==200||request.status==304){
					alert(request.responseText);
				}
			}
			return false;
		}
	}

XML小结

优点：

• XML是一种通用的数据格式。
• 不必把数据强加到已定义好的格式中，而是要为数据自定义合适的标记。
• 利用DOM可以完全掌握文档。

缺点：

• 如果文档来自于服务器，就必须保证文档含有正确的首部信息。若文档类型不正确，那么responseXML的值将是空的。
• 当浏览器接收到长的XML文件后，DOM解析可能会很复杂。

代码示例：

document.getElementsByTagName("a")[0].onclick=function(){
		var request=new XMLHttpRequest();
		var url=this.href;
		var method="GET";
		request.open(method,url);
		request.send(null);
		request.onreadystatechange=function(){
			if(request.readyState==4){
				if(request.status==200||request.status==304){
					var result=request.responseXML;
					//结果不能直接使用，必须先创建对应的节点，再把节点加入到对应位置中
					//如：
					var name=result.getElementsByTagName("name")[0].firstChild.nodeValue;
					var aNode=document.createElement("h2");
					aNode.appendChild(document.creatTextNode(name));
					//作为#detail的子元素插入到页面
					var detailsNode=document.getElementById("details");
					detailsNode.appendChild(aNode);
				}
			}
			return false;
		}
	}

JSON小结

优点：

• 作为一种数据传输格式，JSON与XML很相似，但是它更灵巧。
• JSON不需要从服务器端发送含有特定内容类型的首部信息。

缺点：

• 语法过于严谨。
• 代码不易读。
• eval函数存在风险。

使用JSON代码示例：

//定义一个JSON对象,不过一般是利用对应的函数来生成，不用自己写
var jsonObect={
	"name":"wendy",
	"age":19,
	"address":{"city":"hangzhou","school":"ligong"},
	"studying":function(){
		alert("qianduan");
		}	
	};
	//alert(jsonObect.name);
	//alert(jsonObect.address.city);
	//jsonObect.studying();
	
	var testStr="alert('hello eval')";
	//使用eval()方法将一个字符串转化为本地JS代码执行
	eval(testStr);
	
	var jsonObect="{'name':'wendy'}";
	//把JSON字符串转化为JSON对象
	var testObject=eval("("+jsonObect+")");
	alert(testObect.name);
}

对比小结

• HTML：应用程序不需要与其他应用程序共享数据的时候，使用HTML片段来返回数据是最简单的。
• JSON：数据需要重用的时候，选用JSON在性能和文件大小方面有优势。
• XML：当远程应用程序未知时，XML文档是首选，因为XML是web服务领域的“世界语”。