PHP+Ajax Web开发基础篇

PHP+AjaxWeb开发基础篇Ajax应用利用了一种中间的媒介（Ajax引擎）消除了用户和服务器交互间的等待。Ajax通过异步模式，提升了用户体验。优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用。因此Ajax已经成为Web开发中重要的技术应用。Ajax基础概念Ajax的全称是AsynchronousJavaScriptandXML，Ajax的核心是JavaScript对象XmlHttpRequest。该对象在InternetExplorer5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户，下面我们将为初学者做详细的介绍。如何学习AJAX现在浏览器端以JavaScript为核心，基于各种Web标准(即:早已完成标准化的XHTML/CSS/DOM/XML/XSLT和正在进行标准化的XMLHTTP)的技术正在加速整合，Ajax就是这一系列技术的一个统称。虽然网络上已经有大量的相关资源，但是为了打好基础，认真读上几本书还是很有必要的。好在Ajax并不是什么全新的技术，它仅仅是传统技术的发展和增值，是对于这些基于Web标准的传统技术的重新包装，使其更加适合于企业应用，并且和服务器端结合地更加紧密。因此学习Ajax，首先就要从深入学习这些传统的技术开始。我由浅入深地列出一些我读过的书籍，提供给大家做参考:1、XHTML教程(XHTML)作者:ChelseaValentine,ChrisMinnickNewRiders原版，人民邮电出版社中文版是的，今天你最应该学习的是XHTML，而不是HTML。HTML4.x已经是一个被废弃了的标准，今天的标准是XHTML1.0。XHTML1.0也不是XHTML最新的版本，但是它是目前唯一得到浏览器广泛支持和唯一实用的XHTML版本。2、JavaScript权威指南第四版(JavaScript:TheDefinitiveGuide)作者avidFlanaganO'Reilly原版，中国电力出版社中文版JavaScript爱好者亲切地称之为“犀牛书”，因为O'Reilly以犀牛作为这本书的封面。这是目前JavaScript领域最深入和最权威的入门书。与其它JavaScript相关书籍的区别是这本书一半以上的篇幅着重于深入介绍JavaScript语言本身的基础知识，而不是象其它的书一样把基础知识和与HTML相结合做Web开发的内容(这些内容往往偏重于细节，使得其篇幅很容易就超出了1000页，例如《JavaScriptBible》)混杂在一起。对于刚刚开始学习JavaScript的初学者，这本书毫无疑问是最佳的入门书。3、XML高级编程(ProfessionalXML)DidierMartin等著Wrox原版，机械工业出版社中文版这本书是关于XML开发技术非常详尽的著作。虽然因为作者众多(第一版12个人，第二版好像又多了几个)，无法摆脱Wrox红皮书系列大杂烩的印记，但是这本书可以说是红皮书系列中少有的精品。这本书可以作为XML技术参考书，虽然很厚，但是没有必要从头到尾全部读完。其中与Ajax相关的内容包括XMLDOM、XSLT等等。4、网站重构(DesigningwithWebStandards)作者:JeffreyZeldmanNewRiders原版，电子工业出版社中文版这本书详细地介绍了如何摒弃远古时代(按照我的理解，3年以前吧)不符合标准，专门针对某种浏览器(90%以上的情况下是IE)做开发的恶习，真正采用符合标准的方式来做开发，最终走上向后兼容(注意:不是与浏览器以前不能完整支持Web标准的版本相兼容，而是与浏览器以后的版本相兼容)的平坦大路上来。这本书虽然不是CSS的专著，但是其中充分展示了使用CSS的一些高级技巧。尤其是最后一章展示了完全基于CSS做布局，摒弃使用table做布局的老方法的具体做法。非常遗憾的是这本书的中文版翻译的非常烂，如果不对照原文，很容易误入歧途。读这本书有任何疑问的朋友都可以直接和我联系。上面列出的是与Ajax涉及到的技术相关的书籍。我没有列出CSS的书，是因为我并没有专门读过一本CSS方面的专著。附件是网上流传很广的CSS2.0中文手册，可以作为这方面的参考。读了以上这些书，你已经在技术方面打下了极为坚实的基础，你还需要有一个经常的讨论场所，JavaEye毫无疑问是你最值得来的地方。下面我再列出几本与技术没有直接关系的书籍。5、面向使用的软件设计(SoftwareforUse)作者arryContantine,LucyLockwoodACMPress原版，机械工业出版社中文版大部分的软件都是给人使用的。我在BEAUserGroup上的演讲中说到，Ajax为什么会越来越流行，主要的原因就是它能比传统的基于HTMLFORM的交互模式带给用户更好的交互体验，也就是Ajax可以实现更好的Web可用性(WebUsability，这是目前国外的一个专门的研究领域)，这才是Ajax最大的价值。软件的可用性永远都是一个大的话题，《面向使用的软件设计》正是这方面最权威的专著。我们只要在做最终用户直接使用(有一个可视的界面)的软件开发，提高可用性就是我们需要孜孜不倦追求的目标。6、软件创新之路(InmatesAreRunningtheAsylum)作者:AlanCooperSamsPublishing原版，电子工业出版社中文版7、AboutFace2.0作者:AlanCooperJohnWiley&Sons原版，中文版即将出版上面两本书都是交互设计大师AlanCooper的名著，相信很多朋友都知道AlanCooper的大名，这两本书是交互设计爱好者必读的著作。Ajax程序设计入门一、使用Ajax的主要原因1、通过适当的Ajax应用达到更好的用户体验;2、把以前的一些服务器负担的工作转嫁到客户端，利于客户端闲置的处理能力来处理，减轻服务器和带宽的负担，从而达到节约ISP的空间及带宽租用成本的目的。二、引用Ajax这个概念的最早提出者JesseJamesGarrett认为:Ajax是AsynchronousJavaScriptandXML的缩写。Ajax并不是一门新的语言或技术,它实际上是几项技术按一定的方式组合在一在同共的协作中发挥各自的作用,它包括:·使用XHTML和CSS标准化呈现;·使用DOM实现动态显示和交互;·使用XML和XSLT进行数据交换与处理;·使用XMLHttpRequest进行异步数据读取;·最后用JavaScript绑定和处理所有数据;Ajax的工作原理相当于在用户和服务器之间加了—个中间层,使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像—些数据验证和数据处理等都交给Ajax引擎自己来做,只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求。图2-1图2-2三、概述虽然Garrent列出了7条Ajax的构成技术，但个人认为，所谓的Ajax其核心只有JavaScript、XMLHTTPRequest和DOM，如果所用数据格式为XML的话，还可以再加上XML这一项(Ajax从服务器端返回的数据可以是XML格式，也可以是文本等其他格式)。在旧的交互方式中,由用户触发一个HTTP请求到服务器,服务器对其进行处理后再返回一个新的HTHL页到客户端,每当服务器处理客户端提交的请求时,客户都只能空闲等待,并且哪怕只是一次很小的交互、只需从服务器端得到很简单的一个数据,都要返回一个完整的HTML页,而用户每次都要浪费时间和带宽去重新读取整个页面。而使用Ajax后用户从感觉上几乎所有的操作都会很快响应没有页面重载(白屏)的等待。1、XMLHTTPRequestAjax的一个最大的特点是无需刷新页面便可向服务器传输或读写数据(又称无刷新更新页面),这一特点主要得益于XMLHTTP组件XMLHTTPRequest对象。这样就可以向再发桌面应用程序只同服务器进行数据层面的交换,而不用每次都刷新界面也不用每次将数据处理的工作提交给服务器来做,这样即减轻了服务器的负担又加快了响应速度、缩短了用户等候时间。最早应用XMLHTTP的是微软,IE(IE5以上)通过允许开发人员在Web页面内部使用XMLHTTPActiveX组件扩展自身的功能,开发人员可以不用从当前的Web页面导航而直接传输数据到服务器上或者从服务器取数据。这个功能是很重要的,因为它帮助减少了无状态连接的痛苦,它还可以排除下载冗余HTML的需要,从而提高进程的速度。Mozilla(Mozilla1.0以上及NetScape7以上)做出的回应是创建它自己的继承XML代理类:XMLHttpRequest类。Konqueror(和Safariv1.2,同样也是基于KHTML的浏览器)也支持XMLHttpRequest对象,而Opera也将在其v7.6x+以后的版本中支持XMLHttpRequest对象。对于大多数情况，XMLHttpRequest对象和XMLHTTP组件很相似,方法和属性也类似,只是有一小部分属性不支持。XMLHttpRequest的应用:·XMLHttpRequest对象在JS中的应用varxmlhttp=newXMLHttpRequest();·微软的XMLHTTP组件在JS中的应用varxmlhttp=newActiveXObject(Microsoft.XMLHTTP);varxmlhttp=newActiveXObject(Msxml2.XMLHTTP);XMLHttpRequest对象方法/***Cross-browserXMLHttpRequestinstantiation.*/if(typeofXMLHttpRequest==’undefined’){XMLHttpRequest=function(){varmsxmls=[’MSXML3’,’MSXML2’,’Microsoft’]for(vari=0;imsxmls.length;i++){try{returnnewActiveXObject(msxmls[i]+’.XMLHTTP’)}catch(e){}}thrownewError(NoXMLcomponentinstalled!)}}functioncreateXMLHttpRequest(){try{//AttempttocreateittheMozillawayif(window.XMLHttpRequest){returnnewXMLHttpRequest();}//Guessnot-nowtheIEwayif(window.ActiveXObject){returnnewActiveXObject(getXMLPrefix()+.XmlHttp);}}catch(ex){}returnfalse;};AJAX并不神秘：揭密各种AJAX控件和类库Ajax控件和类库现在真的太多了，不知不觉中增加了Ajax的神秘性和复杂性，看到版内很多人为此费解和伤神，决定发此贴谈谈本人对Ajax的观点，希望能让大家对Ajax有一个本质的认识。观点一：Ajax和服务器端技术毫不相关严格的说，与传统web开发相比，Ajax是完完全全的客户端技术。由于很多控件封装了客户端和服务器端的通信过程，因此很多问题也因通信而起。事实上，不论何种Ajax技术，服务器端都是返回的一个纯文本流，再由客户端来处理这个文本。这段文本可以是xml格式，也可以是一个Html片段，也可以是一段JavaScript脚本，或者仅是一个字符串。服务器端仅仅是作为一个数据接口，客户端使用XMLHttpRequest对象来请求这个页面，服务器端在页面内写入结果文本，这个过程和普通的web开发没有任何区别。所不同的只是，客户端在异步获取结果后，不是直接显示在页面，而是由客户端的Javascript脚本处理后再显示在页面。至于各种控件所谓的能返回DataSet对象，Date对象，或