Ajax技术学习总结Word下载.docx
- 文档编号:19324946
- 上传时间:2023-01-05
- 格式:DOCX
- 页数:8
- 大小:22.15KB
Ajax技术学习总结Word下载.docx
《Ajax技术学习总结Word下载.docx》由会员分享,可在线阅读,更多相关《Ajax技术学习总结Word下载.docx(8页珍藏版)》请在冰豆网上搜索。
TheexactAJAXisnotaparticulartechnology,butaskill,thisskilliswebdevelopmenttechnologyinJavaScriptforadhesiveXHTML,CSS,DOM,XML,xstl,XMLRequestetc.existingandtheformationofcollaborativedevelopmentplatform.ThisplatformismainlylinkedtothetraditionalclientandWebserverasynchronousdatatransfer.
一、Ajax技术背景及发展历程
众所周知,任何一项技术的发展都不可能像孙悟空一样“砰”地一声从石头里面蹦出来,Ajax也不例外。
Ajax是伴随着web技术的发展而产生的,Ajax的产生也带来了由向的转变。
可以说ajax是为了解决传统的web应用当中"
等待-响应-等待“的弊端而创建的一种技术。
下面我来介绍一下Ajax技术的发展历程:
动态网页第一阶段:
服务器端CGI
动态网页第二阶段:
客户端Applet
客户端编程语言:
JavaScript和VBScript
服务器端动态网页技术的繁荣
让客户端有声有色
DHTML的革新
XML及其衍生语言
Ajax概念和技术的出现
不可否认,ajax技术的流行得益于google的大力推广,正是由于googleearth、googlesuggest以及gmail等对ajax技术的广泛应用,催生了ajax的流行。
而这也让微软感到无比的尴尬,因为早在97年,微软便已经发明了ajax中的关键技术,并且在99年IE5推出之时,它便开始支持XmlHttpRequest对象,并且微软之前已经开始在它的一些产品中应用ajax,比如说MSDN网站菜单中的一些应用。
遗憾的是,不知道出于什么想法,当时微软发明了ajax的核心技术之后,并没有看到它的潜力而加以发展和推广,而是将它搁置起来。
对于这一点来说,我个人是觉得非常奇怪的,因为以微软的资源和它的战略眼光来说,应该不会看不到ajax技术的前景,唯一的解释也许就是因为当时它的主要竞争对手Netscape的消失反而使它变得麻痹和迟钝,毕竟巨人也有打盹的时候,比如IBM曾经在对微软战略上的失误。
正是这一次的失误,成就了它现在的竞争对手google在ajax方面的领先地位,而事实上google目前在ajax技术方面的领先是微软所无法达到的,这一点在后面我讲述ajax缺陷的时候也会提到。
现在微软也意识到了这个问题,因此它也开始在ajax领域奋起直追,比如说推出它自己的ajax框架atlas,并且在.也提供了一个用来实现异步回调的接口,即ICallBack接口。
那么微软为什么对自己在ajax方面的落后如此紧张呢现在就让我们来分析一下ajax技术后面隐藏的深刻意义。
二、Ajax技术的意义以及优缺点分析
我们在平时的开发中都多多少少的接触或者应用到了ajax,谈到ajax技术的意义,我们关注得最多的毫无疑问是提升用户的体验。
但是,如果我们结合将来电脑和互联网的发展趋势,我们会发现ajax技术在某些方面正好代表了这种趋势。
为什么这样说呢我们知道,自从电脑出现以来,一直是桌面软件占据着绝对主导的地位,但是互联网的出现和成功使这一切开始发生着微妙的变化。
相当一部分的人都相信,迟早有一天,数据和电脑软件将会从桌面转移到互联网。
也就是说,将来的电脑有可能抛弃笨重的硬盘,而直接从互联网来获取数据和服务,我记得我念大学的时候,有位教授给我们上课的时候,曾经设想过这样一种情景,也许在将来的电脑桌面上,没有任何多余的软件和程序,而仅仅只有一个IE,虽然现在看起来我们距离这一天还很遥远,并且这其中还有很多的问题需要解决,但是我觉得这个并非梦想,而是迟早将实现的现实。
那么,这其中的主要问题就是互联网的连接不稳定,谁也不愿意看着自己的电脑从服务器一点一滴的下载数据,那么,ajax是不是解决了这个问题呢,说实话,与其说ajax解决了这个问题,倒不如
它只是掩盖了这个问题,它只是在服务器和客户端之间充当了一个缓冲器,让用户误以为服务没有中断。
精确的说,ajax并不能提高从服务器端下载数据的速度,而只是使这个等待不那么令人沮丧。
但是正是这一点就足以产生巨大的影响和震动,它实际上也对桌面软件产生了巨大的冲击。
这一点我用一个例子来说明,我们可以比较一下OutlookExpress和Gmail,前者是典型的桌面软件,后者是ajax所实现的B/S模式,实际上后者目前已经在慢慢取代前者了,Gmail在收发邮件的时候已经和OutlookExpress的功能几乎没有差别了,而且它不需要安装客户端程序。
这就是为什么微软对ajax所带来的冲击有着如此的恐惧心理,并且在它前不久所进行的调查之中,将google看做他们未来十年内的主要竞争对手的主要原因之一。
当然,这种变化也并不会将桌面软件全部淘汰,现有的浏览器还没有一个能像PhotoShop等桌面程序那样处理复杂的图像。
但是我们也不能忽视它带来的影响和冲击。
Ajax具有很多web应用无法比拟的优点,主要体现在以下几个方面。
(1)分离数据与呈现
(2)减轻服务器负担
(3)减少宽带消耗
(4)更好的用户体验
(5)市场认可度较高
“金无赤足,人无完人”,强大的Ajax也由于先天原因,存在着
一些缺点。
(1)用户习惯的改变
(2)浏览器的兼容性问题
(3)安全问题
(4)对流媒体的支持不足
(5)对搜索引擎不友好问题
当然,Ajax技术拥有很强大的功能,能适应很多传统web应用无
法很好完成的场景。
(1)表单驱动的交互
传统的表单提交,在文本框输入内容后,点击按钮,后台处
理完毕后,页面刷新,再回头检查是否刷新结果正确。
使用Ajax,在点击sunmit按钮后,立刻进行异步处理,并在页面上快速显示了更新后的结果,这里没有整个页面刷新的问题
(2)深层次的树的导航
深层次的级联菜单(树)的遍历是一项非常复杂的任务,使
用JavaScript来控制显示逻辑,使用Ajax延迟加载更深层次的数据可以有效的减轻服务器的负担。
(3)快速实现用户与用户之间的交流响应
在众多人参与的交流讨论的场景下,最不爽的事情就是让用
户一遍又一遍刷新页面以便知道是否有新的讨论出现。
新的回复应该以最快的速度显示出来,而把用户从分神的刷新中解脱出来,Ajax是最好的选择。
(4)类似投票、yes/no等场景
对于类似这样的场景中,如果提交过程需要达到40秒,很
多的用户就会直接忽略过去而不会参与,但是Ajax可以把时间控制在1秒之内,从而更多的用户会加入进来。
(5)对数据进行过滤和操作相关数据的场景
对数据使用过滤器,按照时间排序,或者按照时间和名称排
序,开关过滤器等等。
任何要求具备很高交互性数据操纵的场合都应该用JavaScript,而不是用一系列的服务器请求来完成。
在每次数据更新后,再对其进行查找和处理需要耗费较多的时间,而Ajax可以加速这个过程。
(6)普通的文本输入提示和自动完成的场景
在文本框等输入表单中给予输入提示,或者自动完成,可以有效的改善用户体验,尤其是那些自动完成的数据可能来自于服务器端的场合,Ajax是很好的选择。
Ajax不适用的场景
(1)部分简单的表单
(2)搜索
(3)替换大量的文本
(4)基本的导航
(5)对呈现的操纵
三、Ajax关键技术和流程
Ajax并不是一种孤立的技术,它是由多种技术综合而成的,这些技术包括:
JavaSvript、XHTML、CSS、DOM、XML、XSTL、XMLRequest等。
DOM实现动态显示和交互,XML实现资料交换和处理,XMLRequest进行异步数据读取,JavaSvript用于绑定和处理所有数据。
(1)JavaSvript
javaScript所处理的每一个对象都是属于一个类(class)
类里边定义了组成对象的数据、属性、方法(即是类里边的一些函数)等,使用类可以增加程序代码的复用性,这在一种程序语言中是很重要的,因为这样可以避免重复开发。
(2)XMLRequest
Ajax的一个最大的特点是无需刷新页面便可向服务器传输或
读写数据(又称无刷新更新页面),这一特点主要得益于XMLHTTP组件XMLHTTPRequest对象。
这样就可以向再发桌面应用程序只同服务器进行数据层面的交换,而不用每次都刷新界面也不用每次将数据处理的工作提交给服务器来做,这样即减轻了服务器的负担又加快了响应速度、缩短了用户等候时间。
对于大多数情况,XMLHttpRequest对象和,MS的XMLHTTP组件很相似,方法和属性也类似,只是有一小部分属性不支持
(3)XML
XML是EXtensibleMarkupLanguage的缩写,XML是一种类似
于HTML的标记语言,XML是用来描述数据的(用来存放数据的),XML的标记不是在XML中预定义的,你必须定义自己的标记,XML使用文档类型定义(DTD)或者模式(Schema)来描述数据XML使用DTD或者Schema后就是自描述的语言。
Ajax是为了解决传统的web应用当中"
等待-响应-等待“的弊端而创建的一种技术,其实质可以理解为:
使用浏览器内置的一个对象(XmlHttpRequest)向服务器发送请求,服务器返回xml数据或者是文本数据给浏览器,然后再浏览器端,使用这些数据更新部分页面,整个过程,页面无任何的刷新。
等待-响应-等待是指:
比如注册用户填写完整个注册信息,然后提交,此时浏览器会将整个注册页面抛弃,等待服务器返回一个新的完整的页面。
在等待过程中,用户不能够做其他操作,服务器生成新的页面发送给浏览器,浏览器需要从新解析这个页面生成相应的界面。
它的流程如下:
(1)Ajax引擎(即XmlHttpRequest对象),首先为该对象注册一个监听器(该监听器是一个事件处理函数,对状态改变事件(readyStatechange)迚行监听)。
(2)当用户对GUI做了某种操作(将产生对应的事件,如焦点失去事件等)。
(3)一旦产生对应的事件,将触发事件处理代码。
(4)在执行事件处理代码时,会调用Ajax引擎(XmlHttpRequest对象)
(5)发送请求:
Ajax引擎被调用后,将独自向服务器发送请求(独立亍浏览器外)继续其他操作:
在Ajax引擎发送请求的同时,用户在浏览器还可以对GUI继续做其他操作该请求是异步请求(Ajax引擎发送请求时,没有打断用户的操作)。
(6)服务器的web组件对请求迚行处理。
(7)服务器可能会调用到数据库戒者处理业务逻辑的Java类。
(8)服务器将处理结果响应给(只返回部分数据,可以是xml戒者文本)Ajax引擎。
(9)监听器通过Ajax引擎获取响应数据(xml戒者文本)
(10)监听器对GUI中的数据迚行更新(局部更新,尤其是整个页面刷新)在整个过程中大部分是通过JS实现的,响应数据可能是xml,所以Ajax可以看做是多种技术的融合。
具体步骤:
(1)获得XmlHttpRequest对象。
该对象由浏览器提供,但是该类型并没有标准化。
ie和其它浏览器不同,其它浏览器都支持该类型,而ie不支持。
<
spanstyle="
font-family:
KaiTi;
"
>
functiongetXmlHttpRequest(){
varxhr=null;
if((typeofXMLHttpRequest)!
='
undefined'
){
xhr=newXMLHttpRequest();
}else{
xhr=newActiveXObject('
'
);
}
returnxhr;
}<
/span>
(2)使用XmlHttpRequest向服务器发请求
varxhr=getXmlHttpRequest();
/*open(请求方式,请求地址,同步/异步)
*请求方式:
get/post
*请求地址:
如果是get请求,请求参数添加到地址乊后。
*比如username=zs
*同步/异步:
true表示异步。
*/
('
get'
'
true);
/*注册一个监听器(即当xhr的状态发生改变产生了readystatechange事件,
*该事件会由f1函数来处理。
我们需要在f1函数里面获得服务器返回的数据,
*然后更新页面)*/
=f1;
/*只有调用send方法乊后,请求才会真正发送*/
(null);
<
(3)发送post请求
varxhr=getXmlHttpRequest();
post'
//必须添加一个消息头content-type
("
Content-Type"
"
application/x-www-form-urlencoded"
username=zs'
(4)在服务器端处理请求
(5)在监听器中,处理服务器返回的响应
是<
=function(){
//编写相应的处理代码
if==4){
//只有readyState等亍4,xhr才完整地接收到了服务器返回的数据。
//获得文本数据
vartxt=;
//获得一个xmldom对象。
varxml=;
//dom操作、更新页面
};
总结
Ajax这个名词是美国AdaptivePath公司(AdaptivePath,LLC)负责用户体验策略的主管杰西·
詹姆斯·
加勒特(JesseJamesGarrett)在2005年2月18日发表的《Ajax:
一种Web应用的新途径》(Ajax:
ANewApproachtoWebApplications)的论文中首先提出的。
在论文中,他明确地将Ajax定义为“AsynchronousJavaScript+XML的简称”[2],也就是基于XML的异步JavaScript。
Ajax的工作原理相当于在用户和服务器之间加了一个中间层,使用户操作与服务器响应异步执行,也就是用户可以向服务器发出一个HTTP请求后,一边做别的事情,一边等待服务器的响应。
通过Ajax,可以使得客户端得到丰富的应用体验及交换操作,而用户不会感觉到有网页提交或刷新,页面也不需要被重新加载,应用的数据交换都被隐藏,整个交互过程是无缝的。
经过一年的Ajax技术学习,我学到了很多的东西,也对网页的前台设计有了更多的了解,使我深深的喜欢上了Ajax这门课程,对它产生了很大的兴趣。
也对JavaScript、XML、DOM等等的这些技术有了新的了解,能够将它们整合起来利用到实际编程中。
设计出更加生动吸引人的页面。
当然在这一年的学习当中离不开赵老师的辛勤指导和教育,我被您严谨的工作态度和和蔼可人的教学方式所打动,使我更加喜欢Ajax,更加喜欢编程。
非常感谢您这一年来的辛苦教育,在这里学生向您表示最诚挚的谢意,向您说一声:
“您辛苦了”。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Ajax 技术 学习 总结