bigqiang 的个人资料多多小虫 天行健日志列表留言簿更多 ![]() | 帮助 |
|
|
2007/8/9 15分钟搞定jQuery(jQuery in 15 minutes)才发现的好东东。jQuery架构的开发者之一Simon Willison在前天新提供了一个简洁明了的用法演示—— 15分钟搞定jQuery(jQuery in 15 minutes)。开发人员提供的教程更应该能体现jQuery的神髓。 内容:
基本上是一部14页的幻灯片,但每页的幻灯片的容量都很大。其精选的例子相当有代表性。以我个人来看,在jQuery的官方公开的API文档没有讲清的细节,比如关于jQuery中end()的用法,我在单看API文档时范例很难看懂,但是看了这个第11张幻灯片的示例就比较清晰了。另外关于CSS选择器的各种写法示例也比较明了。
当然真的想凭这个幻灯片要15分钟搞定jQuery恐怕还是有难度的,需要有些相关参考的一定开发量的。作者最后推荐了jQuery的官方网站和一个API指南网站作为延伸阅读。
Update(2007-11-26):Willison在最近的讲演幻灯片中已经充实这个内容,并把题目改成“30分钟搞定jQuery”(Learning jQuery in 30 minutes)。呵呵,时间延长了一倍,不过内容也充实详细了些,有了更多的示例。
2007/7/11 翻译:《为什么选择Dojo》-兼评测其它主流的JavaScript框架工具包(之二)在翻译《为什么选择Dojo》这篇文章的过程中发现了有关该文章的讨论链接(http://ajaxian.com/archives/why-choose-dojo)。这些讨论中也涉及了很多常用框架的评价,都可以做为第三方的参考意见,同时Dojo官方的开发人员也加入了这场争论当中。讨论中也涉及到其它主流的框架技术特点比较,具有一定参考意义。从讨论中可以看出Dojo早期的版本确实问题多多,而且因为种种问题似乎正在走向衰落。不过还好有Dojo官方开发人员介入讨论才有新的认识,同时也可以感知新版Dojo0.9版应该是被Dojo官方寄予厚望的产品,也许借助这个版本能重新赢得开发人员的支持。这些辩论非常精彩,觉的有必要翻译过来,于是对部分有价值的发言做了翻译整理,放在此处。可以与《〈为什么选择Dojo〉-兼评测其它主流的JavaScript框架工具包(之一)》对照参看。这个系列仅两部分,本文为截止篇。 ==以下是相关讨论的译文================== AsiaPartTime: Timothy Dang: M: gonchuki: r: ajaxus.net: Cyril: kangax: Jonathan: Hank: Tom Trenka:(译注:这个似乎是Dojo的官方人员) Darby Flanagan(译注:这个似乎也是Dojo官方人员) Randy: steve heron: Albert: Dylan Schiemann: Jesse Kuhnert: Brad Neuberg: r: rip747: Tom Trenka: 2007/7/10 翻译:《为什么选择Dojo》-兼评测其它主流的JavaScript框架工具包(之一)认真的选择一个自己合用的Ajax应用平台比较伤脑筋,因为有太多选择了。随便举几个:Prototype、jQuery、Ext、MochiKit、GWT(Google Web Toolkit)、YUI(Yahoo! UI Library)。初次下手为了评测优劣如果每个JavaScript应用框架都学习一遍成本太高了。还好,Dojo Javascript工具包的官方网站前几天出了篇文章《Why Dojo?》(为什么选择Dojo)。这篇文章由于发表在Dojo官方网站因此其结论可能会受其立场影响,但这并不是最重要的问题,重要的是作者在做结论前对市面上主流的JavaScript应用框架功能特点做了一个完整比较,这些对开发者选择一个合适的框架非常具有参考价值。因此我花了些时间来翻译这篇文章。网络转载本文需要指明出处,传统媒体采用本译文需要先联系本人。 就我个人而言最先接触的是Prototype,做了些简单的Ajax项目后很久没有用了。最近一段时间接触了JQuery,感觉真的很好用。有一种说法说Prototype就像Java,而jQuery就像ruby,可惜我既没碰过Java也对ruby涉猎不深,所以这种感受不强烈。不过不妨碍我喜欢jQuery,除简单小巧易于学习外,我觉的最大的特点应该是jQuery能做到JavaScript代码与html生成页面分离。最近设计的项目全用了这个架构,页面内除了在head标签内嵌入js文件的链接外,看不到一行JavaScript代码,真是酷啊。不过因为没有涉及过其它的框架结构,所以在翻译时会遇到一些问题,如果你发现了请指正。 在翻译的过程中发现了有关《为什么选择Dojo》文章的讨论链接(http://ajaxian.com/archives/why-choose-dojo)。这些讨论中也涉及了很多常用框架的评价,都可以做为第三方的参考意见,同时Dojo官方的开发人员也加入了这场争论当中。这些辩论也非常的精彩,我对部分发言做了翻译整理,会放在《〈为什么选择Dojo〉-兼评测其它主流的JavaScript框架工具包(之二)》中。 ==以下是译文================== 如今可供选择的JavaScript工具包有很高质量水准的只有几个,另外因质量和完整程度不同的工具包有几百个。在这海量选项中,为什么要选择Dojo呢? 宽度和广度:Dojo是一个“full stack”的应用框架。不是那种把几个不同的源码简单拼凑在一起的组件。Dojo通过提供集成的底层架构和广泛的可选模块允许每个组件构造成一个高质量积木式的可信赖集合。这些组件给普通用户遇到的问题提供了良好的解决方案,他们也很容易调整以满足你的需求。从基于面板的设计到客户端图表、到数据绑定、到久经考验的模块系统,Dojo是一个考虑了众多用户体验的刚性的底层架构。 质量:国际化及易访问的底层架构是通过Dojo“纤维”编织而成。每次击键都会有正确提示。所有组件做为一个粘着的整体契合在一起。每件东西都是可以很容易与CSS一起进行定制。只消稍做调整即可获得一个漂亮整洁的外观变化,以大量的用户体验为基础(这些人不仅有普通用户,还有设计师和开发人员)做了设计和测试,这些都是它的特点。 性能:Dojo被用于每天都有高访问量和高流量的站点上,采用Dojo的构造工具是为什么如此的一个关键原因。Dojo软件包系统很容易管理大规模的UI开发项目以及构建顶部的系统层,可以做出令人吃惊的应用。所有这些无需代码修改。Dojo也把高性能的普通应用实现打包到了它的核心内,并且Dojo0.9版在性能上给予了更多的关注,减少了代码。它是个小巧、紧凑的工具包并且速度飞快。这些特点使Dojo成为扩展和构建的理想平台。 社区:Dojo是一个开源的社区,个人和公司都能走到一起公平竞争,这使得大家在使用这些工具时彼此获益。Dojo工具包的许可协议被设计成尽可能与政治无关保持中立。我们努力工作也是为了确保在遇到棘手的问题时能很容易得以解决。所有开发都是在开放的环境中进行,并且有意识的降低学习门槛。我们不关心你在哪工作或你是否资深,你在社区中的地位由你所参与的工作质量决定。我们正致力于改变那些可能是开源社区贡献者人的观念,并且我们邀请你加入我们,如果你构造一个伟大的产品并且认为你能帮助我们,我们愿意接受你的任何建议。 Dojo 与别的工具包大比拼 这里拿几个经常与Dojo比较的工具包。下面不是完整的比较,而是基于较高层次上的比较,比如功能特点、设计目标等以及这些特点、设计过程、哲学比之于Dojo有何不同。 MochiKit: Prototype+Scriptaculous: YUI: JQuery: EXT: GWT: 作为比较也列出Dojo: update(2007-10-7): 2006/7/22 prototype.js之ajax.request[翻译] 用了一段时间的prototype.js,这个轻量级的js框架使用的确很方便,许多功能还在研究揣摩中,找来些资料翻译,算是自己的学习笔记。
之所以翻译这篇文章,是因为这篇文章比公开的prototype.js version 1.4.0的技术文档关于ajax.request的讲解部分更具体详细些。
====译文:=============
Prototype 的 Ajax.Request 对象绑定了浏览器的 HTTP request ,使得浏览器中的页面不需要重复刷新。这种HTTP request 既能采用异步也可同步方式。实战中,几乎所有调用都是采用异步方式的(如果采用同步方式调用,只有等一个request调用完成,整个页面加载才算完成,浏览器表现的会比较卡,这种用户体验会很糟糕)
语法new Ajax.Request(url, options); // 对指定的URL产生一个 HTTP request
使用下面的帮助项可以评估 Ajax.Request 的执行效果: 示例基本用法:new Ajax.Request('/foo/bar', {asynchronous:true});
带附加选项用法:可以更改 Request的 method参数值,并且添加些 POST的数据(注意:method名称必须小写): new Ajax.Request('/foo/bar', {method:'post', postBody:'thisvar=true&thatvar=Howdy'});
这里添加了对Request响应((执行成功或执行失败)的处理函数: var handlerFunc = function(t) {
你也可以根据来自服务器执行返回的指定编码,通过使用“on”加上状态编号来设置处理函数。例如: on404。如果 Prototype 没有找到一个已定义项的指定状态编码,它会直接以常用的 onSuccess 和 onFailure 返回。 如果设置了很多项,可用哈希把它们一并传递,如下: var opt = {2006/2/26 教训 开发项目借用了AJAX技术,在测试时发现如果开发适当可以节省很多服务器消耗,部分数据可以保存在客户端,减少服务器的重复计算,而且还可以大大降低对带宽的需求。不过在测试成功后在实施阶段却发现了当时没有料到的问题。
采用开发时,采用的是异步返回HTML页面格式的形式,结果出现了以下问题: 一、在直接访问角本文件进行测试各个相对链接时,没有任何问题,但是通过AJAX访问这些链接时出现了异常。 二、在直接访问角本文件进行测试各个控件的JavaScript角本时没有任何问题,但是通过AJAX方式访问生成的页面,这些js角本完全失效了。不能在新页面下执行各种客户端响应操作。
教训:AJAX技术单纯用于异步获取数据方式可以,如果获取带js和各种页面跳转操作时可能会存在问题。因此尽量减少这种不必要的写法。
现在头好大,看来要重写服务器端的角本成XML数据格式,做起来很辛苦,把里面的角本执行代码全要移植到客户端代码当中,没有更好的解决办法之前,只得如此了。头一次用这项技术就栽了,太郁闷了,心情不好这段时间胃口也奇差。 2006/1/29 AJAX技术资源网站 近一个多月的时间几乎精疲力尽,应该把注意力收回来,开始整顿专注于自己的技术了。希望自己在更长的时间内能够心无杂念平静下来。
鉴于AJAX技术的发展,自已现在才开始关注,似乎有些晚了,不过以后会通过翻译国外相关技术资源网站文章内容的方式来进行自我学习。
Ajax 的诞生
Ajax: A New Approach to Web Applications http://www.adaptivepath.com/publications/essays/archives/000385.php http://www.dragonson.com/doc/ajax.html
Ajax内部交流文档 http://info96.k12studio.com/~nio/comments.php?id=242_0_1_0_C
简单地对 Ajax 进行描述介绍 http://www.adaptivepath.com/publications/essays/archives/000385.php
Ajax: A New Approach to Web Applications http://jibbering.com/2002/4/httprequest.html
Using the XML HTTP Request object 小叮咚机器人Web版发布(体验使用Ajax)
http://developer.apple.com/internet/webcontent/xmlhttpreq.html Dynamic HTML and XML: The XMLHttpRequest Object http://del.icio.us/popular/ajax
del.icio.us / popular / ajax http://www.fiftyfoureleven.com/resources/programming/xmlhttprequest/examples
XMLHttpRequest & Ajax Working Examples http://www.xml.com/lpt/a/2005/02/09/xml-http-request.html
Very Dynamic Web Interfaces http://www.standards-schmandards.com/index.php?2005/03/01/16-ajax-and-accessibility
AJAX and Accessibility AJAX开发人员的编译模式:http://www.ajaxpatterns.org
• XMLHttpRequest教程:“动态网页接口”:http://www.xml.com/pub/a/2005/02/09/xml-http-request.html • JavaScript性能基准:http://blogs.ebusiness-apps.com/dave/?p=14 • AJAX资源:http://www.ajaxmatters.com • JavaScript规范:http://www.ecma-international.org/publications/standards/Ecma-262.htm • 介绍JavaScript对象标识:http://www.crockford.com/JSON/index.html • Mozilla 的Venkman JavaScript调试器:http://www.mozilla.org/projects/venkman/ • XML DOM参考:http://msdn.microsoft.com/library/default.asp?url=/library/en-us/ xmlsdk/html/e9da2722-7879-4e48-869c-7f16714e2824.asp • Microsoft Dynamic HTML reference: http://msdn.microsoft.com/library/default.asp?url=/ workshop/author/dhtml/reference/dhtml_reference_entry.asp • Gecko DOM Reference: http://www.mozilla.org/docs/dom/domref/ • "“移植IE应用到Mozilla” http://www-128.ibm.com/developerworks/web/library/wa-ie2mozgd/ • Mozilla XUL reference: http://www.xulplanet.com/ • Microsoft XAML reference: http://windowssdk.msdn.microsoft.com/library/default.asp?url=/library/ en-us/wcp_conceptual/html/0ff5f36e-dd84-44d1-aa3e-5bb4f147b169.asp?frame=true • James Jesses Garret introduced the term AJAX in his article "AJAX: A New Approach to Web Applications," (Adaptive Path, February 2005): “AJAX:新的网页应用开发方式” http://www.adaptivepath.com/publications/essays/archives/000385.php • JetBrains IntelliJ IDEA: http://www.jetbrains.com/ • Microsoft Visual Studio: http://msdn.microsoft.com/vstudio/ • JSEditor: http://jseditor.sourceforge.net/ • JSEclipse: http://www.interaktonline.com/Products/Eclipse/JSEclipse/Overview/ • ActiveState Komodo: http://www.activestate.com/Products/Komodo/ • XHTML: http://www.w3.org/TR/xhtml1/ • Document Object Model: http://www.w3.org/DOM/ • Cascading Style Sheets: http://www.w3.org/Style/CSS/ • Extensible Stylesheet Language: http://www.w3.org/Style/XSL/ • XForms: http://www.w3.org/MarkUp/Forms/ • Scaling Vector Graphics: http://www.w3.org/Graphics/SVG/ • XPath: http://www.w3.org/TR/xpath • AJAX.Net: http://ajax.schwarz-interactive.de/csharpsample/default.aspx • Backbase: http://www.backbase.com • Bitkraft: http://www.tiggrbitz.com/ • Django: http://www.djangoproject.com/ • Dojo: http://www.dojotoolkit.org/ • DWR (Direct Web Reporting): http://getahead.ltd.uk/dwr/ • MochiKit: http://mochikit.com/ • Prototype: http://prototype.conio.net/ • Rico: http://openrico.org/rico/home.page • Sajax: http://www.modernmethod.com/sajax/ • Sarissa: http://sarissa.sourceforge.net/doc/ • Script.aculo.us: http://script.aculo.us/ • Ruby on Rails: http://www.rubyonrails.org/ • For more on AJAX and DWR, read "AJAX Made Simple with DWR," Cloves Carneiro Jr. (JavaWorld, June 2005): 关于AJAX和DWR,请阅读“AJAX使用DWR更简单” http://www.javaworld.com/javaworld/jw-06-2005/jw-0620-dwr.html • For more articles on Java development tools, browse the Development Tools section of JavaWorld’s Topical Index: 更多Java开发工具的文章,请浏览JavaWorld的开发工具部分索引页 http://www.javaworld.com/channel_content/jw-tools-index.shtml • For more articles on XML, browse the Java and XML section of JavaWorld’s Topical Index: 更多XML的文章,请浏览JavaWorld的Java和XML部分索引页 http://www.javaworld.com/channel_content/jw-xml-index.shtml • For more articles on UI design, browse the User Interface Design section of JavaWorld’s Topical Index: 更多UI设计的文章,请浏览JavaWorld的UI设计部分索引页 http://www.javaworld.com/channel_content/jw-ui-index.shtml 免责声明:以后本类别栏目以译文为主,但因主要用于本人学习之用,所以所有我的译文极可能都没有获得原作者翻译授权。因此任何人以任何方式借用本文进行投稿或其它任何形式的获利行为所造成与原作者间的法律纠纷与本人无关。 |
|
|