Ajax从服务器获取的数据都是字符串，但是通过不同的解析，可以解析为XML或者JSON。
一般来说.使用XML格式的数据比较通用,但是服务器和客户端解析起来都比较复杂一些;而使用JSON语句话,服务端需要多做一些工作,但到了客户端,通过使用eval()函数来进行解析,就会获得js对象,使用起来很方便.在使用过程中,究竟使用哪种方法,这个要根据项目的实际需要,建议:在能使用JSON的情况下,尽量使用JSON.
例子
1、XML数据user.xml
1 <?xml version="1.0" encoding="utf-8" ?>
2 <users>
3 <user>
4 <username>张三XML</username>
5 <age>33</age>
6 </user>
7 <user>
8 <username>李四XML</username>
9 <age>34</age>
10 </user>
11 </users> 2、JSON数据user.js
1 [
2 { username: "张三JSON", age: 33 },
3 { username: "李四JSON", age: 32 }
4 ] 3、HTML页面代码
1 <html>
2 <head>
3 <title>Ajax</title>
4 <style type="text/css">
5 table,td,th
6 {
7 border:solid 1px silver;
8 border-collapse:collapse;
9 text-align:center;
10 }
11 th,td
12 {
13 width:100px;
14 height:20px;
15 }
16 </style>
17 <script type="text/javascript">
18 function GetXML() {
19 var xmlHttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
20 xmlHttp.open("get", "XML/user.xml?random=" + Math.random(), true);
21 // 绑定回调函数
22 xmlHttp.onreadystatechange = function () {
23 if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
24 // 获取返回的XML数据主体内容
25 var result = xmlHttp.responseXML.documentElement;
26 // 获取user节点元素
27 var users = result.getElementsByTagName("user");
28
29 for (var i = 0; i < users.length; i++) {
30 // 获取单个user
31 var user = users[i];
32 // 获取user的具体信息
33 var userName = user.getElementsByTagName("username")[0].childNodes[0].nodeValue;
34 var age = user.getElementsByTagName("age")[0].childNodes[0].nodeValue;
35 // 添加行
36 appendRow(userName, age);
37 }
38 }
39 }
40 // 发送请求
41 xmlHttp.send();
42 }
43 // 添加新行
44 function appendRow(username, age) {
45 var ui = document.getElementById("userinfo");
46 // 添加新行
47 var newRow = ui.insertRow(ui.rows.length);
48 // 添加新的单元格
49 newRow.insertCell(0).innerHTML = username;
50 newRow.insertCell(1).innerHTML = age;
51 }
52 // 获取JSON数据
53 function GetJSON() {
54 var xmlHttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
55 xmlHttp.open("get", "JSON/user.js?random=" + Math.random(), true);
56 xmlHttp.onreadystatechange = function () {
57 if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
58 var result = xmlHttp.responseText;
59 // 使用eval函数使返回的字符串变成js对象
60 var users = eval("(" + result + ")");
61 for (var i = 0; i < users.length; i++) {
62 // 获取单个user信息
63 var user = users[i];
64 // 此处已经知道user数据的格式，故可以直接使用
65 appendRow(user.username, user.age);
66 }
67 }
68 }
69 xmlHttp.send();
70 }
71 </script>
72 </head>
73 <body>
74 <input type="button" value="加载XML数据" onclick="GetXML();" />
75 <input type="button" value="加载JSON数据" onclick="GetJSON();" />
76 <br />
77 <br />
78 <table id="userinfo">
79 <thead>
80 <tr>
81 <th>姓名</th>
82 <th>年龄</th>
83 </tr>
84 </thead>
85 </table>
86 </body>
87 </html> 运行结果如下：
![Ajax——模板引擎[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)