英文?a href="http://d/Administrator%CE%C4%B5%B5%BA%CD%CA%D5%B2%D8%BC%D0/http%7C//manual.dojotoolkit.org/WikiHome/DojoDotBook" target="_blank">:http://manual.dojotoolkit.org/WikiHome/DojoDotBook
译: Burnet
译者序:随着web2.0的热?google,yahoo{各大web供应商争先恐后的退qajax开发包,意图争夺ajax标准.I竟鹿死谁手?有h看好Y(ji)ui,有h喜欢GWT,q有人对q些都嗤之以?认ؓ自己写javascript才是王道.
好了,谁优谁劣暂放一?现在我要l大家的是由IBM研发的dojo开发工?toolkit)的开发首?由我来翻?
最后说一句题外话,本h出国已久,虽然qxl常上CSDN之类的论?但是对中文术语还不是非常_N?所以有的时候翻译一些术语的时候不太准?? 会把那些我拿不准的术语在后面标注上英?q有本书作者风格比较幽默,有些不能直译中文Q也没有必要译Q我会尽我所能,目的是让大家能掌握Dojo?/font>
做h要厚道,转蝲误名专?a target="_blank">Burnet's Blog
q里给你对于dojo的启蒙课E。你可能会跟自己?q段可以跌了,因ؓ我已l很了解javascriptq且对网站开发很了解了。“不q这里有个机会让你认识到其实你的知识q不是那么扎实,q有很多基础的东襉K要学习?/p>
?我们lh们介ldojo的时候,遇到了两U难题。有些用户已l用DHTML很久Qƈ且对javascript有了很深的理解,他们清楚 javascript能作什么,不能做什么,在脑里存在定型思维Q有些时候,更难让这些h明白dojo。第二种N是对于那些新手Q他们太~Zl验? 对javascript的了解了?/p>
我鼓p两种朋友都读一下介l内容,甚至你可以不全看?/p>
什么是DojoQ?/strong>
其实ȝDojo到底是什么是非常困难的。我说ȝDojo是很困难的,是因为Dojo是一个可扩展的代码集? Qexpandable collection of code)。扩展不只是来自于众多开发者,q且你会发现你可以根据你自己的需要扩展自q一套东ѝ就是说Q你把目光放在Dojow上的原因是因ؓ Dojo可以和javascript取长补短?/p>
在开发客LQclientQside developmentQd?个主要部分:eventsQ重复用DHTML blocksQ客L和服务器传递信息。Dojo在这三方面都很在行,q且使他们变的很Ҏ(gu)?/p>
历史
译者注Q历史我是真不想译了,如果有h很感兴趣的话Q可以给我留aQ我有时间会译的?/p>
。。。。。。。。。。。?/p>
什么是工具QToolkitQ?
很多为结构(frameworkQ,库(libraryQ,工具是同一个意思。但是弄清楚它们之间的区别,对于以后的理解很有帮助?/p>
Framework
在Y件开发中Qؓ了让其他的项目可以分享和合作Q通常定义一个结构(frameworkQ。一个结构通常包含支持E序Qsupport programsQ,库和一个脚本程序。你可能认识到Dojo是framework的一个部分,但ƈ不是framework的本w?/p>
Library
库文件定义了很多可以引用的方法(functionQ,它们是在M位置都可以运行的Qƈ不是我们q_自己在程序中定义的方法。看了这些,你可能会说“嘿Qdojo是库的集合Q”。你应该是对的,但是Qdojo比一个库的集合要包含得多很多?/p>
Toolkit
? q前文,你可能还在琢到底dojo是作什么的。很明显Q他不是一个结构(frameworkQ,它是一个工PtoolkitQ或者是一个库Q最后让? 来解{一下,通常库都是之前定义好的,你可以引用到你的E序中ƈ使用它们Q但是在dojo中,我们在这个库外面加了一层封包系l。这样就使它跟一般的库有 些不一栗?/p>
在这个系l中Q我们把库分成很多部分。有核心Ҏ(gu)Qcore functionsQ,q有很多其他不常用的子库Qsub libraryQ。这׃你用dojo的时候感觉它很简z。下面会有更具体的分析,会让你更加明白dojo?/p>
Dojo会给你什?/strong>
曄QNetscape盛行一Ӟ大部分h都在使用Q所以当时Netscapel出了一个网站制作的标准。好景不长,后来出现了微软的IEQIE当时NetscapeQ成Z新的标准。但是这个标准跟W3C有一定的差别Q所以在Z制作|站Ӟ开始向IE新标准靠拢?/p>
很多q过MQIE依旧不|Q而且q没有更新很多。一样多的bugQ缺标准化。慢慢的|虫们开始用firefoxQoperaQsafariQ它们ؓ了跟上W3C的标准,所以更新得很快?/p>
很多同样的功能,但是对于不同的浏览器需要写不同的代码,q对我们来说意味着什么?意味着我们要做Z个完的|站是很苦难的。这时一个程序员会去做什么呢Q?/p>
知识补充
如果光用静态html制作|站Q当然不会出C面的问题Q但是这也意呌|站不可能具有交互性,最多的也只是提供一个表单(formQ让用户提交Q然后再q回一个新的页面显C数据?/p>
Javascript的出现正是ؓ了解册些难题?/p>
解决所有问?/strong>
Dojo不仅是存在于抽象层,q且也是独立存在的。不只是提供一些库Q一些方法,一些功能,而且让的代码更加z,保证你的代码只包含所需要的部分?/p>
Dojo会让你的生活更加单,因ؓ他替你链接了很多东西Q把你的复杂目分成一些小问题Q让你的代码更简z,更有效率Qƈ且可以更好的重复使用?/p>
W一章:开始用Dojo
Dojo有很多版本,你可以一下子不知道该选择哪个Q这里可以让你放心,无论你用的是什么版本,本书中的例子你都可以q行?/p>
Q译者注Q这个是我用的版本Qzip文gQ你也可以自己到Dojoa主页q行下蝲。)
Dojo模块QModulesQ?/strong>
Dojo的库定义使用了模块,像JAVA一栗这样可以让你只引用自己需要的部分Q而不是全部,保证了浏览速度?/p>
例如Dojo的event包定义在模块dojo.event中?/p>
Q译者注Q此部分原著甚是啰嗦Q我l精了一下,有兴的朋友可以参见原文。)
引用模块格式Q?/p>
dojo.require("dojo.module[.sub module]");
例如我们惛_用lite effects systemsQ?/p>
dojo.require("dojo.lfx");
q会引入所有lfx下的子模块,当然你也可以使用dojo.lfx.*Q如果想单独引用lfx下的toggle模块Q?/p>
dojo.require("dojo.lfx.toggle");
Widgets
什么是widget呢?一个按?Q一个图片,q都是widgetQ最常见的html widget有链接,按钮Q输入框?/p>
使用Dojo可以改变widget Q例如在日期输入框旁边加上一个彩色日历,让用户可以选择日期Q与此同时Dojoq不会破坏你原始的输入框Q因为Dojo是扩展了你的html而不是替换了它?/p>
使用widget的优势主要三点:
- 跨^収ͼ使用Dojo widgetQ无Z用Q何浏览器Q都会准的得到正确效果?/li>
- 自动退化:一些老浏览器可能对javascript支持q不是那么完,Dojo也可以让它们昄出正的内容Q例如前面彩色日历的例子Q如果浏览器不支持,那么Dojo会自动将日历退化到一个简单的选择框,或者其他(Ҏ(gu)不同widget而定Q?/li>
- 扩展性:你可以利用Dojo提供的widget创造出新的widgetQ在q个q程中你q不需要从库中复制M代码或者修改库中的代码?/li>
如何使用Widget
Widget有很多用方法。Widget会搜索整个网|Ӟ然后自动把应该添加的内容加入到当中?/p>
下面是个单的例子Q我们也可以看出WIdget是怎样自动退化的Q因为我们ƈ没有lComboBox定义选择,而只是一个valueQ而且所以最后显C出来的只象是一个简单的inputboxQ?/strong>如果用户用了javascriptQ显C结果也会一栗?/p>
<input dojoType="ComboBox" value="default" dataUrl="comboBoxData.js">
但是如果我们只想使用W3C标准Q?font color="#990000">译者注Q没有那些额外的tagQ例如dojoTypeQ,我们可以用下面的Ҏ(gu)?/p>
<input class="dojo-ComboBox?" value="default" dataUrl="comboBoxData.js">
<dojo:ComboBox? value="default" dataUrl="comboBoxData.js">
你可能注意到了dataUrlQ他的作用是把comboBoxData.js中的内容加到comboBox中,但是现在comboBoxData.js中没用Q何内宏V(译者注Q当然你可以随意改变dataUrl的内容,名字不是固定的?/font>Q?/p>
下面是一个select的例子:
<select dojoType="combobox">
<option value="foo">foo</option>
<option value="bar">bar</option>
<option value="baz">baz</option>
<option value="thud">thud</option>
</select>从上面的例子中,你知道了很多事情Q但却好像没什么用处,q里只是惛_诉你其实dojoq没有那么复杂?/p>
后退和前q?/strong>
动态网늨序(dynamic web applicationQ避免了频繁的刷新页面,不过通常也带来后退和前q按钮会失去作用。更多的Q有的时候,用户可能很难把网加入收藏夹?/p>
Dojo提供了一个解军_法,让网늨序处理浏览器的后退和前q,q且提供l浏览器一个唯一的地址。这个解军_法就是用dojo.undo.browser?/p>
使用dojo.undo.browser
在dojo 0.2.2版本中,q没有dojo.undo.browserQ这是在0.3以后的版本中才加入的?/p>
首先Q需要用dojo.undo.browser.setInitialStae(state)讑֮当浏览器W一ơ蝲入网늚状态?/p>
理论
? 态网늨序会调用XMLHTTPRequest和DOM来更新网内容而避免了hQ更新浏览历Ԍq且也不会改变浏览器的地址栏。这意味着当用L? 了后退按钮Q整个网늨序丢׃当前q行的状态(stateQ。而且即用户x当前的网内容加入收藏夹Q也是不可能的,因ؓ收藏夹不会记录网늨序运 行的状态,而只会简单的记录下网늨序的地址QURLQ?/p>
开发者可以用dojo.undo.browser包得到用Ld退和前q的事gQeventQ,然后Ҏ(gu)q些事g来更新页面内宏V? dojo.undo.browser通过使用一个隐藏的表单Qhidden IFRAMEQ或者一个唯一的标{(fragment identifierQ传递浏览的历史记录。(译者注Q可以想像成一个cookie或者一个sessionQ但是这个session信息是存储在hidden IFRAME或者标{中Q?例如Q?/p>
http://some.domain.com/my/path/to/page.html#fragmentIdentifier
Q?font color="#990000">译者注Q?fragmentIdentifier是标签记录Q?/font>
因ؓ当改变标{时候ƈ不会使网刷斎ͼ所以非帔R合记录当前|页E序的状态。当然开发者可以自定义一个更Ҏ(gu)L的标{,q且使用户可以把它加入收藏夹?/p>
dojo.undo.browser允许开发者创Z个相对于q行状态的对象Qstate objectQ,q个对象会得到回叫(callbackQ当用户点击后退或者前q按钮?/p>
开?/strong>
下面是用dojo.undo.browser之前必须作的一些事情:
1Q在djConfig中设|?strong>preventBackButtonFix: false。这样保证了隐藏的表单(hidden IFRAMEQ将会添加到面当中Q如果不加入q段Qdojo.undo.browser不会正常工作?/p>
译者注Q设|方法就是在header中加入如下代码:
<script language="JavaScript" type="text/javascript">
djConfig = { isDebug: true, preventBackButtonFix: false };
</script>2: 加入dojo.require("dojo.undo.browser");
讑֮|页E序的初始状态:
dojo.undo.browser.setInitialState(state);
当用hơ点dq或者后退Qstate对象都会被调用?/p>
然后我们需要给state对象创徏几个Ҏ(gu)QfunctionQ?/p>
- 得到后退提示Q?strong>backQ)Q?strong>backButtionQ)或?strong>handleQtypeQ?/strong>Qtype可以是“back”或者是“forward”?/li>
- 得到前进提示Q?strong>forwardQ)QforwardButtonQ)或?strong>handle(typeQ?/strong>Qtype如上?/li>
下面是个单的例子Q?/p>
var state = {
back: function() { alert("Back was clicked!"); },
forward: function() { alert("Forward was clicked!"); }
};注册一个state对象使用下面的方法:
dojo.undo.browser.addToHistory(state);
? 果向改变?gu)览器的地址QURLQ,引用state对象的changeUrl属性。如果changeUrl是trueQdojo.undo.browser 将产生一个唯一的标{,如果changeUrl被定义ؓM其他的|不包括undefinedQnullQ?和空stringQ,那么q个值就会被? 用ؓ标签。这L户就可以把当前页加入收藏夹了?/p>
提示
- 如果你要使用changeUrlQ即使你不设定自q标签Q也臛_定义为true?/li>
- 如果你要在本机测试,不要使用IE。因为当IE讉K本地文g时不会创建历史列表ifram_history.html。请把网上传到服务器上试?/li>
- Safari2.0.3+Q只有后退按钮可以正常工作Qƈ且只有当changeUrl没用使用的时候?/li>
- Opera 8.5.3Q不会正常运行?/li>
q里有一个网上的例子Q?/p>
http://archive.dojotoolkit.org/nightly/tests/undo/test_browser.html
发布Dojo
译者注Q此部分的英文版q没有完成,所以暂不翻译了Q以后一定会补上?/font>
6?7日更斎ͼ
I/O
dojo.io.blind介绍
在我们制作dojo的时候,目的是让用户和开发者都能n受到DHTMLE序。在很多朋友的支持下Q特别是Aaron
Boodman和Mark AndersonQ我们已l找C解决可用性的Ҏ(gu)。我们提供了一个单独的易用的API和一个包装类Q这个类只需要两个文件。dojo.io包提供了对XMLHTTP和一些其他更复杂的传输结构的支持?br />
在dojo.io
包中我们一般最怋用的是dojo.io.bind()Ҏ(gu)。dojo.io.blind()是一个标准的异步的请求APIQ它包含了各U传输层
Qtransport layersQ,包括queues of
iFrames,XMLHTTP,mod_pubsub,LivePage{等。Dojo会试图ؓ当前的请求选择最合适的传输Ҏ(gu)Q因为在做网站时一般不
会用到其他传输Q所以我们只用到XMLHTTP。dojo接受一个匿名的c,但是在知道这个类的属性的情况下,把它作ؓҎ(gu)参数Qfunction
argumentQ。下面的代码是创Z个请求(requestQ,q个h会从URLq回原始的字W串?br />
q是我第一译Q有什么错别字Q表达不明确q希望理解?/p>
如果有什么意见或者徏议,LaQ谢谢!
做h要厚道,转蝲误名专?a href="/burnet/" target="_blank">Burnet's Blog?/font>