Ajax — 返回数据的用途
每次进行的简单Ajax请求并没有什么不同，重要的是从服务器返回的数据能帮助我们完成任务。1. 基于XML的RSS Feed
从服务器返回的数据格式中最普遍的是XML格式，所有现代的浏览器都对XML文档有直接的支持，能即时将它们转换为DOM形式，只要像遍历其它DOM一样的遍历它就可以了。通常无法使用getElementById函数遍历服务器返回的XML文档，这是因为浏览器对非HTML的XML文档没有创建唯一的id属性。下面展示一个例子，从基于XML的远程RSS Feed来加载文章的标题
[code lang="js"]
Dynamic RSS Feed Widget
// 等待文档加载完毕
window.onload = function(){
// 使用Ajax载入RSS feed
ajax({
// RSS feed的URL
url: "rss.xml",
// xml文档类型
type: "xml",
// 请求成功后执行
onSuccess: function( rss ) {
// 把所有RSS feed的标题都插入到id为'feed'的
- 中
- 元素来存放标题
var li = document.createElement("li");
// 将它的内容设置为项目标题
li.innerHTML = titles[i].firstChild.nodeValue;
// 添加到- 元素中
feed.appendChild( li );
}
}
});
};
Dynamic RSS Feed Widget
Check out my RSS feed:
[/code]
从上面的例子可以看出，一旦把Ajax请求/响应过程的复杂性解决了，剩下的处理其实并不复杂。XML是一种从服务器端快速传输数据到客户端的方法。
2. 注入HTML
可以用Ajax实现的另一个有用的技巧是，动态地将HTML片段注入到文档里。这个技巧和遍历XML的方法区别在于，不必解析和遍历从服务器返回的数据，就可以把它们插入到文档中。
从远程文件加载一段HTML代码，并将它注入到当前的网页中：
[code lang="js"]
HTML Sports Scores Loaded via AJAX
// 等待文档加载完毕
window.onload = function(){
// 使用Ajax载入RSS feed
ajax({
// HTML文档的url
url: "scores.html",
// HTML文档类型
type: "html",
// 请求成功后执行
onSuccess: function( html ) {
// 将数据插入到id为'scores'的div中
var scores = document.getElementById("scores");
// 将新的HTML文档注入文档
scores.innerHTML = html;
}
});
};
HTML Sports Scores Loaded via AJAX
[/code]
3. JSON与JavaScript
JSON数据可以作为XML文档的一种轻量级的替代品。此外，从服务器提供纯JavaScript代码则是一个构建动态多用户Web应用程序的好方法。
动态载入并执行一个远程JavaScript文件：
[code lang="js"]
// 加载远程的JavaScript文件
ajax({
// JavaScript文件的url
url: "myscript.js",
// script文档类型
type: "script"
});
[/code]查看完整版本： Ajax — 返回数据的用途
Tags:
var feed = document.getElementById("feed");
// RSS XML文档中所有的标题
var titles = rss.getElementsByTagName("title");
// 遍历标题
for ( var i = 0; i < titles.length; i++ ) {
// 创建一个