首页 > 编程笔记 > JavaScript笔记
阅读:9
AJAX是什么(新手必看)
AJAX 是 Asynchronous JavaScript and XML 的缩写,它的意思是异步的 JavaScript 和 XML。
AJAX 并不是一门新的语言或技术,它是 JavaScript、XML、CSS、DOM 等多种已有语言或技术的组合,可以实现客户端的异步请求操作,从而实现在不需要刷新页面的情况下与服务器进行通信,减少了用户的等待时间,减轻了服务器和带宽的负担,提供了更好的服务响应。
在 Web 应用的传统模型中,客户端的用户界面中用户的每一次操作都将触发一次返回服务器端的 HTTP 请求,服务器端的 Web 服务器对 HTTP 请求进行相应的处理(数据存储、后端处理和继承系统)后,返回一个 HTML 页面(HTML+CSS 数据)给客户端。Web 应用的传统模型如下图所示。

图 1 Web应用的传统模型
而在 Web 应用的 AJAX 模型中,客户端的用户界面中用户的操作将通过 AJAX 引擎与服务器端进行通信,然后服务器端在 Web 和 / 或 XML 服务器处理后将返回结果(XML 或字符串数据)提交给客户端页面的 AJAX 引擎,再由 AJAX 引擎来决定将这些数据插入用户页面的哪个位置。Web 应用的 AJAX 模型如下图所示。

图 2 Web 应用的 AJAX 模型
从图 1 和图 2 中可以看出,对于用户的每一次操作,在 Web 应用的传统模型中,将生成一次 HTTP 请求,而在 Web 应用的 AJAX 模型中,将变成对 AJAX 引擎的一次 JavaScript 调用。
在 Web 应用的 AJAX 模型中可以通过 JavaScript 实现在不刷新整个页面的情况下,对部分数据进行更新,从而减少网络流量的消耗,给用户带来更好的体验。
下面介绍 AJAX 的优点:
1) AJAX 可以把一部分以前由服务器承担的工作转移到客户端,利用客户端闲置的资源进行处理,减轻服务器和带宽的负担,节约空间和成本。
2) AJAX 实现无刷新更新页面,从而使用户不用再像以前一样在服务器处理数据时,只能在白屏前焦急地等待。AJAX 使用 XMLHttpRequest 对象发送请求并得到服务器响应,在不需要重新载入整个页面的情况下,就可以通过 DOM 及时将更新的内容显示在页面中。
3) AJAX 可以调用 XML 等外部数据。
4) AJAX 基于标准化并被广泛支持的技术,不需要下载插件或者小程序,即可轻松实现桌面应用程序的效果。
5) AJAX 没有平台限制。AJAX 把服务器的工作由原本的传输内容转变为传输数据,而数据格式可以是纯文本格式和 XML 格式,这两种数据格式没有平台限制。
为使 AJAX 在各个浏览器中都能够正常运行,开发人员必须花费大量精力编码,从而实现各个浏览器兼容 XMLHttpRequest 对象,这样就使 AJAX 开发难度高于普通 Web 开发难度。
用户通常希望单击“后退”按钮取消前一次操作,在 AJAX 中用户可能无法这样做。
AJAX 并不是一门新的语言或技术,它是 JavaScript、XML、CSS、DOM 等多种已有语言或技术的组合,可以实现客户端的异步请求操作,从而实现在不需要刷新页面的情况下与服务器进行通信,减少了用户的等待时间,减轻了服务器和带宽的负担,提供了更好的服务响应。
在 Web 应用的传统模型中,客户端的用户界面中用户的每一次操作都将触发一次返回服务器端的 HTTP 请求,服务器端的 Web 服务器对 HTTP 请求进行相应的处理(数据存储、后端处理和继承系统)后,返回一个 HTML 页面(HTML+CSS 数据)给客户端。Web 应用的传统模型如下图所示。

图 1 Web应用的传统模型
而在 Web 应用的 AJAX 模型中,客户端的用户界面中用户的操作将通过 AJAX 引擎与服务器端进行通信,然后服务器端在 Web 和 / 或 XML 服务器处理后将返回结果(XML 或字符串数据)提交给客户端页面的 AJAX 引擎,再由 AJAX 引擎来决定将这些数据插入用户页面的哪个位置。Web 应用的 AJAX 模型如下图所示。

图 2 Web 应用的 AJAX 模型
从图 1 和图 2 中可以看出,对于用户的每一次操作,在 Web 应用的传统模型中,将生成一次 HTTP 请求,而在 Web 应用的 AJAX 模型中,将变成对 AJAX 引擎的一次 JavaScript 调用。
在 Web 应用的 AJAX 模型中可以通过 JavaScript 实现在不刷新整个页面的情况下,对部分数据进行更新,从而减少网络流量的消耗,给用户带来更好的体验。
AJAX技术的优点
与传统的 Web 应用不同,AJAX 在用户与服务器之间引入了一个中间媒介(AJAX 引擎),从而消除了网络交互过程中的处理—等待—处理—等待过程的缺点,大大改善了网站的视觉效果。下面介绍 AJAX 的优点:
1) AJAX 可以把一部分以前由服务器承担的工作转移到客户端,利用客户端闲置的资源进行处理,减轻服务器和带宽的负担,节约空间和成本。
2) AJAX 实现无刷新更新页面,从而使用户不用再像以前一样在服务器处理数据时,只能在白屏前焦急地等待。AJAX 使用 XMLHttpRequest 对象发送请求并得到服务器响应,在不需要重新载入整个页面的情况下,就可以通过 DOM 及时将更新的内容显示在页面中。
3) AJAX 可以调用 XML 等外部数据。
4) AJAX 基于标准化并被广泛支持的技术,不需要下载插件或者小程序,即可轻松实现桌面应用程序的效果。
5) AJAX 没有平台限制。AJAX 把服务器的工作由原本的传输内容转变为传输数据,而数据格式可以是纯文本格式和 XML 格式,这两种数据格式没有平台限制。
AJAX技术的缺点
同其他事物一样,AJAX 也不尽是优点,它也有缺点,它的缺点主要体现在以下方面。1) 浏览器对XMLHttpRequest对象的支持不足
IE 从 5.0 版本开始才支持 XMLHttpRequest 对象,Mozilla、Netscape 等浏览器支持 XMLHttpRequest 对象的时间晚于 IE。为使 AJAX 在各个浏览器中都能够正常运行,开发人员必须花费大量精力编码,从而实现各个浏览器兼容 XMLHttpRequest 对象,这样就使 AJAX 开发难度高于普通 Web 开发难度。
2) 破坏浏览器“前进”“后退”按钮的正常行为
在传统页面中,用户会习惯性地使用浏览器自带的“前进”“后退”按钮,但使用 AJAX 破坏了浏览器“前进”“后退”按钮的正常行为。在更新动态页面的情况下,用户无法回到前一个页面的状态,因为浏览器仅能记录历史记录中的静态页面。用户通常希望单击“后退”按钮取消前一次操作,在 AJAX 中用户可能无法这样做。