当前位置: 首页 > 图文教程 > 网络编程 > AJAX技术 > ajaxrequest.js ajaxrequest 0.7最新版 使用AJAXRequest进行AJAX应用程序开发入门小技巧

AJAX技术
一个简单的ASP+AJAX留言本源码下载
IE7下ajax之open Method New的说明
ASP+Ajax实现无刷新评论简单例子
AJAX的阻塞及跨域名解析
[js]一个获取页面ip的正则
AJAX乱码解决新方法
也写一个Ajax.Request类附代码
AJAX简历系统附js文件
Ajax留言本源码 提供下载了
找到一款不错的基于AJAX留言板源码(PHP版、ASP版)提供下载了
Ajax 学习资源 中外都有
本人ajax留言板的源程序 不错的应用js
xmlhttp 乱码 比较完整的解决方法 (UTF8,GB2312 编码 解码)
AJAX集天气\IP\多国语言翻译MP3(可同步LRC歌词显示)\万年历查询通
AJAX缓存问题的两种解决方法(IE)
AJAX 常用函数创建XMLHTTP对象,区别IE,Mozilla浏览器
Ajax的小贴士使用小结
用ajax动态加载需要的js文件
XMLHTTP多浏览器兼容性写法
PJBLOG中用到的ajaxjs.几个简单的函数

AJAX技术 中的 ajaxrequest.js ajaxrequest 0.7最新版 使用AJAXRequest进行AJAX应用程序开发入门小技巧


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-13   浏览: 65 ::
收藏到网摘: n/a

使用AJAXRequest进行AJAX应用程序开发(1) - 初识AJAXRequest
前言
在发布了AJAXRequest类的几个版本之后,渐渐地有许多朋友用上了它,也有许多朋友问我有没有更详细的说明和示例。不过因为时间的问题以及我能想到的示例有限,一直没有多写几个示例。考虑了一下,决定写一个关于AJAXRequest的教程,希望对使用AJAXRequest类的朋友们有所帮助。
准备
在使用AJAXRequest进行AJAX开发之前,你需要做以下准备:
准备知识:JavaScript基本语法,文档对象模型(DOM)的相关知识,以及至少掌握一种后台编程的语言(我写的例子以ASP为编程语言)。
准备工具:EditPlus或者其他文本编辑器(Dreamweaver或者Visual Web Developer也可以),以及本地测试用的Web服务器(IIS或者Apache或者NetBox或其他都可以)。
下载AJAXRequest类:你可以在http://www.xujiwei.cn/works/ajaxrequest/下载到最新版的AJAXRequest类。
要进行AJAX开发,你需要了解JS编程,这是AJAX中J的需要,以及后台编程,这是需要在服务端进行动态处理,DOM用来处理信息,将结果呈现给用户。而工具方面,文本编辑器可以选择你自己喜欢的,我比较喜欢用EditPlus。
至于测试用的Web服务器,就取决于你所用的后台编程语言了,如ASP或ASP.NET是IIS,PHP可以选择Apache等。运行ASP的另外一个选择是NetBox,不过NetBox对UTF-8支持不太好,如果不涉及非英文的输出,可以考虑选择这个轻量级的服务器软件。
至于为什么要在本地建立测试服务器而不是直接在浏览器中运行,是因为从一开始就在与服务器相近的环境中开发,可以在以后的开发过程中减少许多莫名的错误。
开始
在之后教程的例子中,我都将以JS代码与XHTML代码分开的方式来书写,其中AJAXRequest类文件ajaxrequest.js放在例子代码的同一目录下。
Hello,World!
按照惯例,以一个“Hello,World!”来开始。
helloworld.htm
程序代码:
复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="author" content="xujiwei" />
<meta name="copyright" content="www.xujiwei.cn" />
<meta name="description" content="hello,world" />
<title>Hello,World!</title>
<!-- 包含AJAXRequest类文件 -->
<script type="text/javascript" src="ajaxrequest.js"></script>
<!-- 包含页面需要的JS代码 -->
<script type="text/javascript" src="helloworld.js"></script>
</head>
<body>
<!-- 一个按钮,单击调用函数showHello,显示欢迎信息 -->
<button onclick="showHello();">显示Hello,World!</button>
</body>
</html>

在helloworld.htm中,我们在页面上放置了一个button,用于触发showHello函数,显示从服务端获取的信息。
helloworld.js
程序代码:
复制代码 代码如下:

// 创建AJAXRequest对象,以全局变量的方式来保存这个对象,这样在整个页面应用程序中就只需要创建一次AJAXRequest类对象,而不用重复创建。
var ajax=new AJAXRequest();
/////////////////////////////////////////
// showHello
// 描述:向服务端发送请求并显示返回信息
// 参数:无
// 返回:无
/////////////////////////////////////////
function showHello() {
// 使用get方法向服务端获取文件helloworld.txt的内容,
// 并在函数mycallback中进行处理
ajax.get("helloworld.txt",mycallback);
}
/////////////////////////////////////////
// mycallback
// 描述:向服务端发送请求并显示返回信息
// 参数:obj - XMLHttpRequest对象,保存服务端返回信息
// 返回:无
/////////////////////////////////////////
function mycallback(obj) {
// 用alert来显示服务端返回的内容
// obj.responseText为helloworld.txt的内容
alert(obj.responseText);
}

在helloworld.js中,创建了一个全局变量ajax,用于保存一个AJAXRequest对象,如果在有多个函数需要用到AJAXRequest时,就不需要重新创建AJAXRequest类实例,只需要直接使用ajax就行了。因为AJAXRequest类中具有连接池的特性,因此不会出现在网络延迟较大时后来的请求覆盖前面的请求的情况。
helloworld.txt
程序代码:
Hello,World!
helloworld.txt为客户端需要的内容,欢迎信息“Hello,World!”。
小结
在上面的教程中,我们写了一个小小的AJAX应用程序,用于在客户端用AJAXRequest类从服务端获取一个文本文件,并将它的内容显示出来。可以看出来,在上面的程序中,我们只是很简单的用了AJAXRequest的get方法,就完成了从服务器获取文件内容的过程。
在接下来的教程中,我们将继续学习AJAXRequest类的使用。
to be continued ...