精彩专题推荐:建站之入门课 建站之必修课 建站之关键课 网站价值所在 流量提高专题 css+div 标准 个人网站打造全过程
返回建站学首页
导航:
建站首页 | 网站设计 | 网站开发 | 网站运营 | 网页软件 | 建站指南 | 搜索优化 | 图像处理 | 视频教程 | 书籍教程 | 建站专题
当前位置:首页>网站开发>ajax教程>正文

揭开AJAX神秘面纱


来源: 时间:06-11-28 点击: 点击这里收藏本文
 本文通过一个简单的例子来说明如何在IE6中使用AJAX技术。在这例子中,客户端每隔十秒,从服务器端取回一个随机的字符串,在不重新刷新页情况下,自动更新部分页面内容。例子仅用到了两个jsp文件,client.jsp及server.jsp

AJAX,即"Asynchronous JavaScript And XML"的缩写,可翻译为异步JavaScript及XML技术。其核心是一个寄宿在浏览器中名为XMLHTTPRequest的类。通过此类,可以做到无需提交表单就可以实现与服务器的连接;无需刷新整个页面,就可以动态更新页面中一部分的内容。XMLHTTPRequest通常使用XML作为数据交换的载体,但也可使用其他的载体,如纯文本。简单来说,就是通过XMLHTTPRequest发送信息给服务器,异步接收服务器处理并返回信息,然后通过JavaScript动态更新页面的部分内容。

尽管AJAX近来非常火爆,但AJAX并非新的技术,正如其名所示,只不过是JavaScript加上XML的技术罢了。而且使用上非常简单。

应用AJAX的流程:
1、定义一个事件处理器
2、获取XMLHTTPRequest,并将事件处理器注册给它
3、与服务器连接
4、发送信息
5、服务器返回处理完毕的信息
6、每当XMLHTTPRequest的状态发生变化,自动触发事件处理器
7、事件处理器动态更新页面


本文通过一个简单的例子来说明如何在IE6中使用AJAX技术。在这例子中,客户端每隔十秒,从服务器端取回一个随机的字符串,在不重新刷新页情况下,自动更新部分页面内容。例子仅用到了两个jsp文件,client.jsp及server.jsp。为了方便说明,我用server.jsp来代替本应作为Servlet的Server.java。

先看client.jsp内容:

<%@page contentType="text/html"%>
<%@page pageEncoding="gb2312"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        < meta http-equiv="Content-Type" content="text/html; charset=gb2312">
        <title>AJAX Demo</title>
        < script language="JavaScript">
            var xmlHttp;
            
            function getGiftFromServer() {
                var url = "http://localhost:8084/ajax/server.jsp";
                if (window.ActiveXObject) {
                    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                }

                xmlHttp.onreadystatechange = showGift;

                xmlHttp.open("GET", url, true);
                xmlHttp.send(null);
                
                setTimeout("getGiftFromServer()",10000);
            }
9 7 3 1 2 3 4 8 :

  把此文章收藏到:          
广而告之
文章搜索
  • Google JZxue.Com

关于我们 | 联系我们 | 友情链接 | 网站地图
Copyright © 2005 - 2006 建站学 All rights reserved.