什么是AJAX

By admin at 2007-08-07 • 0人收藏 • 1075人看过

[转载自IT168站.原无署名]

[转者按]
  最新的BBSXP2007官方版本,时髦地采用了大量AJAX网络编程技术(其效果相当于Add论坛搞的活动数据缓存,目的是尽量减少无谓重复运算、减轻服务端的负担特别是库查询负担)。那么什么是AJAX也就成了广大站长的应解之谜,本文可使你有一个初步的了解...


  AJAX的全称是“Asynchronous JavaScript and XML”(即“异步JavaScript和XML”)。这是一种多项成熟技术的组合,其目的是让Web应用获得与用户快速即时交互的能力。AJAX所组合的技术,包括:
    • JavaScript(Java脚本语言)
    • DHTML,Dynamic HTML(动态HTML)
    • XML,Extensible Markup Language(可扩展标记语言)
    • CSS,Cascading Style Sheets(层叠样式表单)
    • DOM,Document Object Model(文档对象模型)
    • 微软的称为XMLHttpRequest的对象

  在AJAX技术下,用户会感觉到网页与普通桌面应用一样,响应迅速,而不是像传统网页那样,任何操作都需要等待页面的刷新。AJAX是如何做到这一点的呢?有两个秘密:第一,其实AJAX也会刷新页面,只不过,AJAX可以只刷新部分页面,而不是整个页面;第二,AJAX的页面刷新是异步的,就是说,用户可以继续他的其他操作,而不必等候刷新完成。

  当用户浏览一个基于AJAX的Web应用时,用户的请求被提交给一个称为“AJAX引擎”的代理,这个引擎负责接收用户请求,从Web服务器上获取响应,并更新浏览器内容。形象地说,传统的Web应用中,浏览器是直接和Web服务器打交道的,而在AJAX应用中,浏览器和Web服务器之间出现了一个来回跑腿的“中介”,而且这个 “中介”相当的勤快,所以,能够给浏览器提供更好的服务,从而使用户获得更满意的应用体验。

  AJAX应用的例子,Google Map是一个典型。打开Google Map网站(http://maps.google.com),会看到一张地图,对地图进行放大、缩小以及拖动等操作,网页的响应十分迅速,看起来好像浏览器事先加载了整张地图。其实,浏览器只是根据你的操作,向服务器请求你所看到的那些数据,并异步地更新你的浏览器内容,这一切,都拜AJAX所赐。

  JavaScript和微软的XMLHttpRequest对象,是AJAX 引擎的两条腿。当与浏览器交互时,AJAX引擎使用JavaScript语言;而当与Web服务器交互时,则使用微软的XMLHttpRequest对象。由于AJAX引擎依赖微软的XMLHttpRequest对象技术,所以,早期只有微软的IE浏览器支持AJAX。现在,随着采用AJAX技术的Web应用的不断涌现,所有主流的浏览器(例如Firefox、Netscape、Opera等)也都支持AJAX了。



[本帖主追加的实际案例]

在BBSXP2007上的AJAX应用──新用户注册时,于表单提交前对所输用户名是否已被注册的实时检查:

①CreateUser.asp文件:

输入用户名行
  <td align="right" width="23%"><b>用户名:</b></td>
   <td align="Left" width="77%"><input type="text" name="UserName" size="40" onblur="CheckUserName(this.value)"> <span id="CheckUserName" style="color:#FF0000"></span></td>

*绿色代码负责其事件触发——当用户名输入完成光标焦点离开本行时,立即叫用CheckUserName这个js脚本程序。
*橙色代码负责反馈区预留——在该行末端预留一个能显示检验结果的信息反馈区。

检验用户名的JS脚本
<script type="text/javascript">
function CheckUserName(UserName) {
...
 Ajax_CallBack(false,"CheckUserName","Loading.asp?menu=CheckUserName&UserNameLength="+UserName.length+"&UserName=" + UserName);
...
</script>

*蓝色代码负责发出AJAX请求——叫用服务端Loading.asp来实施数据库查询和结果输出。


②Loading.asp文件:

 case "CheckUserName"
  UserName=HTMLEncode(Request.QueryString("UserName"))
...
  if not Conn.Execute("Select UserID From [BBSXP_Users] where UserName='"&UserName&"'" ).eof Then
   Response.write("<img src='images/check_error.gif' align=absmiddle />&nbsp;"&UserName&" 已经有人使用,请另选一个!")

  else
   Response.write("<img src='images/check_right.gif' />")
  end if

*黄色代码为若库查询已有该用户名,则向检验信息反馈区输出一个×图、并加汉字提示...
*粉色代码为若没有该用户名,则向检验信息反馈区输出一个√图。

──这就是AJAX的所谓“局部提交”或“中途客-服间交互”(在未正式提交全局信息前,就将局部某些咚咚搞定)
AJAX的精髓就在于此!

登录后方可回帖

登 录
信息栏

Carbon Forum是一个基于话题的高性能轻型PHP论坛

下载地址:Carbon Forum v5.9.0
QQ群:12607708(QQ我不常上)

donate

手机支付宝扫描上方二维码可向本项目捐款

粤公网安备 44030602003677号
粤ICP备17135490号

Loading...