当前位置: 网学 > 编程文档 > Ajax > 正文

AJAX 简介及入门实例

来源:Http://myeducs.cn 联系QQ:点击这里给我发消息 作者: 用户投稿 来源: 网络 发布时间: 13/07/12
换句话说,JavaScript 代码在幕后发送请求,用户甚至不知道请求的发出。更好的是,请求是异步发送的,就是说 JavaScript 代码(和用户)不用等待服务器的响应。因此用户可以继续输入数据、滚动屏幕和使用应用程序。

然后,服务器将数据返回 JavaScript 代码(仍然在 Web 表单中),后者决定如何处理这些数据。它可以迅速更新表单数据,让人感觉应用程序是立即完成的,表单没有提交或刷新而用户得到了新数据。JavaScript 代码甚至可以对收到的数据执行某种计算,再发送另一个请求,完全不需要用户干预!这就是XMLHttpRequest 的强大之处。它可以根据需要自行与服务器进行交互,用户甚至可以完全不知道幕后发生的一切。结果就是类似于桌面应用程序的动态、快速响应、高交互性的体验,但是背后又拥有互联网的全部强大力量。
加入一些 JavaScript
得到 XMLHttpRequest 的句柄后,其他的 JavaScript 代码就非常简单了。事实上,我们将使用 JavaScript 代码完成非常基本的任务:

获取表单数据:JavaScript 代码很容易从 HTML 表单中抽取数据并发送到服务器。
修改表单上的数据:更新表单也很简单,如设置字段值或者迅速替换图像。
解析 HTML 和 XML:使用 JavaScript 代码操纵 DOM,处理 HTML 表单服务器返回的 XML 数据的结构。
对于前两点,需要非常熟悉 getElementById() 方法,如 清单 2 所示。

清单 2. 用 JavaScript 代码捕获和设置字段值
复制代码 代码如下:
// Get the value of the "phone" field and stuff it in a variable called phone
var phone = document.getElementById("phone").value;
// Set some values on a form using an array called response
document.getElementById("order").value = response[0];
document.getElementById("address").value = response;

这里没有特别需要注意的地方,真是好极了!您应该认识到这里并没有非常复杂的东西。只要掌握了 XMLHttpRequest,Ajax 应用程序的其他部分就是如 清单 2 所示的简单 JavaScript 代码了,混合有少量的 HTML。

2. AJAX的优缺点是什么?
2.1 AJAX的优点
使用AJAX最大的优点,就是能在不更新整个页面的前提下维护数据。这使得Web应用程序能更为迅捷得对用户请求进行反馈,提高了用户体验的同时,避免了在网络上发送那些没有改变过的信息。

传统的Web应用允许用户端填写表单(form),当送出表单时就向Web服务器发送一个请求。服务器接收并处理传来的表单,然后送回一个新的网页,但这种做法浪费了很多带宽,因为:在前后两个处理后反馈的页面汇总,大部分的HTML代码往往是相同的。由于每次应用的沟通都需要向服务器发送请求,应用的回应时间久依赖于服务器的响应时间,这导致了用户界面的回应比本机应用慢很多。

与此不同的是,AJAX应用可以仅向服务器发送并取回必要的数据,它使用SOAP或其它一些基于XML的页面服务接口(界面),并在客户端采用JavaScript处理来自服务器的回应。因为在服务器和浏览器之间交换的数据大量减少(大约只有原来的5%),结果我们就能看到回应(服务器回应)更快的应用(结果)。同时很多的处理工作可以在发出请求的客户端机器上完成,所以Web服务器的处理时间也减少了。

2.2 AJAX的缺点
对应于AJAX最主要的批评是:它可能破坏浏览器后退按钮的正常行为。在动态更新页面的情况下,用户无法回到前一个页面的状态,这是因为浏览器仅能记下历史记录中的静态页面。一个被完整读入的页面与一个已经被动态修改过的页面之间的差别非常微妙:用户通常都希望单击后退按钮,就能够取消他们的前一次操作,但是在AJAX页面中,可能无法这样做。不过开发者已想出了种种办法来解决这个问题,当中大多数都是在用户单击后退按钮访问历史记录时,通
  • 上一篇资讯: Ajax 超时检查脚本
  • 下一篇资讯: ajax 开发守则 10条说明
  • 网学推荐

    免费论文

    原创论文

    设为首页 | 加入收藏 | 论文首页 | 论文专题 | 设计下载 | 网学软件 | 论文模板 | 论文资源 | 程序设计 | 关于网学 | 站内搜索 | 网学留言 | 友情链接 | 资料中心
    版权所有 QQ:3710167 邮箱:3710167@qq.com 网学网 [Myeducs.cn] 您电脑的分辨率是 像素
    Copyright 2008-2015 myeducs.Cn www.myeducs.Cn All Rights Reserved 湘ICP备09003080号