日期:2014-05-16  浏览次数:20637 次

[随记]锋利的jQuery 第六章 jQuery与Ajax的应用



第六章 jQuery与Ajax的应用


6.1 Ajax的优势和不足


6.1.1 Ajax的优势

1. 不需要插件支持

Ajax不需要任何浏览器插件,就可以被绝大多数主流浏览器所支持,用户只需要允许JavaScript在浏览器上执行即可。


2. 优秀的用户体验

Ajax能在不刷新整个页面的前提下更新数据,这使得Web应用程序能更为迅速地回应用户的操作。


3. 提高Web程序的性能

与传统模式相比,Ajax模式在性能上的最大区别就在于传输数据的方式,在传统模式中,数据提交是通过表单来实现的,而数据获取是靠页面刷新来重新获取整页的内容。而Ajax模式只是通过XMLHttpRequest对象向服务器端提交希望提交的数据,即按需发送。


4. 减轻服务器的带宽的负担

Ajax的工作原理相当于在用户和服务器之间加了一个中间层,使用户操作与服务器 响应异步化。它在客户端创建Ajax引擎,把传统方式下的一些服务器负担的工作转移到客户端,便于客户端资源来处理,减轻服务器和带宽的负担。


6.1.2 Ajax的不足

1. 浏览器对XMLHttpRequest对象的支持度不足

Ajax的不足之一首先来自于浏览器。程序员必须花费大量的精力编码以兼顾各个浏览器之间的差别,来让Ajax应用能够很好地兼容各个浏览器。


2. 破坏浏览器前进、后退按钮的正常功能

在Ajax中前进和后退按钮的功能都会失效。


3. 对搜索引擎的支持的不足

对于搜索引擎的支持也是Ajax的一项缺憾。搜索相关的爬虫程序现在还不能理解那些奇怪的JavaScript代码和因此引起的页面内容的变化。


4. 开发和调试工具的缺乏

JavaScript是Ajax的重要组成部分,在目前,缺少很好的JavaScript开发和调试工具。


6.2 Ajax的XMLHttpRequest对象

Ajax的核心是XMLHttpRequest对象,它是Ajax实现的关键——发送异步请求、接收响应及执行回调都是通过它来完成的。

XMLHttpRequest对象提供了一个相对精简易用的API。


6.4 编写第1个Ajax例子

IE5、IE6是以ActiveXObject的方式引入XMLHttpRequest对象的,而其他浏览器的XMLHttpRequest对象是window的子对象。


使用open()方法初始化XMLHttpRequest对象,指定HTTP方法和要使用的服务器URL。open(method,url,async) 规定请求的类型、URL以及是否异步处理请求。

参数说明:

method:请求的类型;GET 或 POST

url:文件在服务器上的位置

async:true(异步)或 false(同步)

默认情况下,使用XMLHttpRequest对象发送的HTTP请求是异步进行的,但是可以显式地把async参数设置为true。


因为要做一个异步调用,所以需要注册一个XMLHttpRequest对象将调用的回调事件处理器当它的readyState值改变时调用。当readyState值被改变时,会激发一个readystatechange事件,可以使用onreadystatechange属性来注册该回调事件处理器。


使用send()方法发送该请求,因为这个请求使用的是HTTP的GET方式,所以可以在不指定参数或使用null参数的情况下调用send()方法。