ajax认识

原创 2007年09月29日 17:37:00

术语Ajax用来描述一组技术,它使浏览器可以为用户提供更为自然的浏览体验。在Ajax之前,Web站点强制用户进入提交/等待/重新显示范例,用户的动作总是与服务器的“思考时间”同步。Ajax提供与服务器异步通信的能力,从而使用户从请求/响应的循环中解脱出来。借助于Ajax,可以在用户单击按钮时,使用JavaScript和DHTML立即更新UI,并向服务器发出异步请求,以执行更新或查询数据库。当请求返回时,就可以使用JavaScript和CSS来相应地更新UI,而不是刷新整个页面。最重要的是,用户甚至不知道浏览器正在与服务器通信:Web站点看起来是即时响应的。

虽然Ajax所需的基础架构已经出现了一段时间,但直到最近异步请求的真正威力才得到利用。能够拥有一个响应极其灵敏的Web站点确实激动人心,因为它最终允许开发人员和设计人员使用标准的HTML/CSS/JavaScript堆栈创建“桌面风格的(desktop-like)”可用性。


与传统的web应用比较

传统的web应用允许用户填写表单(form),当提交表单时就向web服务器发送一个请求。服务器接收并处理传来的表单,然后返回一个新的网页。这个做法浪费了许多带宽,因为在前后两个页面中的大部分HTML代码往往是相同的。由于每次应用的交互都需要向服务器发送请求,应用的响应时间就依赖于服务器的响应时间。这导致了用户界面的响应比本地应用慢得多。

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

Ajax的工作原理

 

Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。

在创建Web站点时,在客户端执行屏幕更新为用户提供了很大的灵活性。下面是使用Ajax可以完成的功能:

  • 动态更新购物车的物品总数,无需用户单击Update并等待服务器重新发送整个页面。
  • 提升站点的性能,这是通过减少从服务器下载的数据量而实现的。例如,在Amazon的购物车页面,当更新篮子中的一项物品的数量时,会重新载入整个页面,这必须下载32K的数据。如果使用Ajax计算新的总量,服务器只会返回新的总量值,因此所需的带宽仅为原来的百分之一。
  • 消除了每次用户输入时的页面刷新。例如,在Ajax中,如果用户在分页列表上单击Next,则服务器数据只刷新列表而不是整个页面。
  • 直接编辑表格数据,而不是要求用户导航到新的页面来编辑数据。对于Ajax,当用户单击Edit时,可以将静态表格刷新为内容可编辑的表格。用户单击Done之后,就可以发出一个Ajax请求来更新服务器,并刷新表格,使其包含静态、只读的数据。

 

Ajax的优势

1、减轻服务器的负担。因为Ajax的根本理念是“按需取数据”,所以最大可能在减少了冗余请求和响影对服务器造成的负担;

2、无刷新更新页面,减少用户实际和心理等待时间;

首先,“按需取数据”的模式减少了数据的实际读取量,打个很形象的比方,如果说重载的方式是从一个终点回到原点再到另一个终点的话,那么Ajax就是以一个终点为基点到达另一个终点;



图5-1

图5-2

其次,即使要读取比较大的数据,也不用像RELOAD一样出现白屏的情况,由于Ajax是用XMLHTTP发送请求得到服务端应答数据,在不重新载入整个页面的情况下用Javascript操作DOM最终更新页面的,所以在读取数据的过程中,用户所面对的也不是白屏,而是原来的页面状态(或者可以加一个LOADING的提示框让用户了解数据读取的状态),只有当接收到全部数据后才更新相应部分的内容,而这种更新也是瞬间的,用户几乎感觉不到。总之用户是很敏感的,他们能感觉到你对他们的体贴,虽然不太可能立竿见影的效果,但会在用户的心中一点一滴的积累他们对网站的依赖。

3、更好的用户体验;
4、也可以把以前的一些服务器负担的工作转嫁到客户端,利于客户端闲置的处理能力来处理,减轻服务器和带宽的负担,节约空间和带宽租用成本;
5、Ajax由于可以调用外部数据;
6、基于标准化的并被广泛支持和技术,并且不需要插件或下载小程序;
7、Ajax使WEB中的界面与应用分离(也可以说是数据与呈现分离);
8、对于用户和ISP来说是双盈的。

Ajax的问题

1、一些手持设备(如手机、PDA等)现在还不能很好的支持Ajax;
2、用JavaScript作的Ajax引擎,JavaScript的兼容性和DeBug都是让人头痛的事;

3、Ajax的无刷新重载,由于页面的变化没有刷新重载那么明显,所以容易给用户带来困扰――用户不太清楚现在的数据是新的还是已经更新过的;现有的解决有:在相关位置提示、数据更新的区域设计得比较明显、数据更新后给用户提示等;

4、对流媒体的支持没有FLASH、Java Applet好;

 

认识AjAX&jQery的基础

  • 2015年06月10日 19:02
  • 457KB
  • 下载

关于ajax的初步认识

  • 2015年11月24日 11:45
  • 82KB
  • 下载

正确认识ajax!必读!

====================================================== 注:本文源代码点此下载 =============================...

初步认识Ajax

  • 2013年10月21日 15:20
  • 504KB
  • 下载

认识Ajax的作用,对象及属性

  • 2012年12月07日 14:24
  • 17KB
  • 下载

正确认识ajax!必读!

====================================================== 注:本文源代码点此下载 =============================...

对于ajax的认识

、AJAX的异步传输就是面向字符串的传输,他的单位是字符串;而同步传输主要是面向比特的传输,单位是帧,它传输时传输方和接收方的时钟要一致。 2、异步传输为什么要以一个起始位为头         ...

Ajax初步认识:

Ajax是Asynchronous(异步)JavaScript and XML的意思。 Ajax不是一种编程语言,而是一种独立于Web服务器的Web浏览器技术。 Ajax向服务器发送HTTP请求,...

Asp.net_Ajax局部刷新初步认识

(例一) Default.aspx ...
  • ls_man
  • ls_man
  • 2012年01月14日 15:02
  • 3159

Ajax的初步认识和封装

Ajax=异步JavaScript和XML(标准通用标记语言的子集),是一种用于创建快速动态的网页技术,实现了局部刷新的功能,毫无疑问,这给用户带来的体验是很棒的,原理采用了异步访问技术,通过在后台与...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ajax认识
举报原因:
原因补充:

(最多只允许输入30个字)