dojo1.1的主要更新

dojo1.1发布也有些时日了，今天静下来看了看到底有哪些更新以及对项目的影响，顺便把release notes大体翻译了过来。

Core

    dojo.fromJson解析失败时，会抛出error，需要程序员手动try、catch
   

        var result = text;
        try{
         result = dojo.fromJson(text);
        }catch(e){
         // squelch exception, use input as result
        }
    

    多版本支持
dojo1.1可以与其他版本的dojo共存，甚至可以修改dojo的库名称，详细见:Dojo Book Page on multiversion support
    在DOM载入后再加载dojo
        设置djConfig.afterOnLoad = true，这是测试页面 没感觉到这个功能的用处，并且在DOM载入后如果移动鼠标有可能引起javascript，整个dojo都无法载入。

    XMLHttpRequest的变化
以前那一堆dojo.xhrGet(), dojo.xhrPost(), dojo.xhrRawPost(), dojo.xhrPut(), dojo.xhrRawPut() 还有 dojo.xhrDelete()，现在终于有了一个通用的函数：dojo.xhr()。

使用dojo.xhr*将发送名为“X-Requested-With”的http header，值为“XMLHttpRequest”

    cacheBust
        如果设置djConfig.cacheBust = (new Date()).getTime()，载入模块和模板时，将把这个cacheBust的值将添加到URL中，防止浏览器缓存。在1.0里面其实已经存在，也是个不知所云的功能。

    dojo.attr()
新增加dojo.attr()，dojo.hasAttr()，还有dojo.removeAttr()函数，用于获取DOM节点的attribute

    var d1 = dojo.byId('div1');
    console.debug(dojo.attr(d1,"id"));
    console.debug("div1 has age?" + dojo.hasAttr(d1,"age"));
    dojo.attr(d1,"age",18);
    console.debug("div1 has age?" + dojo.hasAttr(d1,"age"));
    console.debug(dojo.attr(d1,"age"));

    dojo.style()
dojo.style现在可以一次性设置多个css属性，以前是这样的：

    dojo.style(dojo.byId('div2'),"width","700px;");
    dojo.style(dojo.byId('div2'),"height","600px;");

        现在可以这样了：

    dojo.style(dojo.byId('div2'),{
        width:"700px",
        height:"600px",
        background:"#ccf"
    });

    dojo.query/NodeList
dojo.query()结果可以使用attr()、instantiate()，还有之前就可以使用的style()也可以使用上面的那种dojo.style()的用法了。

    dojo.style("thinger", {
        "opacity": 0.5,
        "border": "3px solid black",
        "height": 300
    });

       

    动画/animation
修正了动画效果的性能问题，增加了一个新的dojo.anim()方法，默认的duration从1秒变成了350ms，简化了指定动画属性的语法。另外重写了dojo.fx.combine()和dojo.fx.chain()的集成，现在集成不同的动画效果更加简单。
        dojo.anim("id", { opacity: 0 }, 1000);

    Adobe AIR的支持
    1.1里面dojo提供了更好的AIR支持。http://www.dojotoolkit.org/air


Dijit

    widget模板的变化
input类型的widget（包括ValidationTextBox, ComboBox等）的模板从<table>转变成<div>，因此自定义的样式也需要跟着修改了:(
dijitTabInnerDiv的css class名字变成为了dijitTabContent
Dialog,TooltipDialog的模板发生变化（触发关闭事件的名称从hide变成了onCancel，这说明把事件定义在模板里不是一个好的实践？）


    themes/主题
新的主题 nihilo
soria终于完成了，貌似算dojo里比较好看的了……
更新了原有的tundra主题（还是很难看）

    新的widget
   

       
• SimpleTextArea 不会自动改变大小的TextArea……
       
• MultiSelect组件 就是个多选的列表框，不要报太大希望，功能上很简陋。
   

    Layout widgets
    新的BorderContainer提供了更小巧的js文件、更平滑的缩放效果。SplitContainer和LayoutContainer已经是deprecated，请使用新的BorderContainer。

    Tree
    做了大量BUG修复和改进工作，一些API已经被标注为deprecated。1.1里主要修复了1.0里面tree关于拖动的bug，改进了数据更新的问题，使用了新的dojo.data.ItemFileWriteStore。详细请点击这里

    Dialog, TooltipDialog
现在可以在其中放入TabContainer了，如果放入了Layout widgts，请千万不要在初始化方法里把整个dialog设置为style="display:none"，而是使用style="visibility:hidden"来代替。
在dialog的DateTextBox里按ESC不会关闭dialog了。
open dialog时，将把焦点放到第一个input组件里

    Features/Bug fixes
   

       
• highlighting/focus invalid fields on attempted form submit
• separate edit and display mode for input widgets like NumberTextBox and CurrencyTextBox. For example, when editing US$ on an en-us locale machine, the $ sign and commas disappear
• input widget formatting bugs fixed (use of table abandoned)
• reset of forms now supported (must use dijit.Form widget)
   

    Form widgets API更新与变化

        引入了新的setAttribute()，旧的方法被标注为deprecated：
setDisabled(Boolean) ==> setAttribute("disabled", Boolean)
setChecked(Boolean) ==> setAttribute("checked", Boolean)

原有的setValue()/getValue()更加贴近语义：
        获取value时使用getValue()，根据组件的不同而不同，尤其是CheckBox组件。
        由用户输入的值使用setValue，程序设置的值使用setAttribute("value", ...);

CheckBox.getValue()会根据checkbox的状态进行序列化。
当CheckBox未选中时 ==> getValue()返回“false”
其他时候返回CheckBox的“value”
同样，CheckBox.setValue(Boolean)只会使CheckBox变为选中 or 未选中状态
如果要改变CheckBox的值，请使用setAttribute("value",...)，同理对于Button也是如此
       

所有的form widget使用onFocus()/onBlur()，以前那一堆onblur,_onBlur等鬼东西现在走上正轨了。

自定义的Form widget需要从dijit.form._FormValueWidget继承，以前是使用的dijit.form._FormWidget。如果是CheckBox一类，不需要用户直接输入value的widget，可以从dijit.form._FormWidget继承。

        dijit.Form widget fixes [url="http://trac.dojotoolkit.org/ticket/5775" target="_blank"]#5775[/url]


    其他
FireFox3兼容(屁话)
允许指定tooltip的位置（above/below/before/after）
Bidi: All widgets should now be BiDi-compliant and mirror properly when dir=rtl is set on the document
A11y - basically everything except Grid accessible

    CSS class名称变化(自定义组件可能会受影响)
    See #6104
IEFixedToolbar → dijitIEFixedToolbar
dijitProgressBarVertical → dijitProgressBarV
dijitProgressBarHorizontal → dijitProgressBarH
RuleContainer → dijitRuleContainer
HorizontalRuleContainer → dijitRuleContainerH
VerticalRuleContainer → dijitRuleContainerV
RuleLabel → dijitRuleLabel
RuleLabelContainer → dijitRuleLabelContainer
HorizontalRuleLabelContainer → dijitRuleLabelContainerH
VerticalRuleLabelContainer → dijitRuleLabelContainerV
HorizontalRuleLabel → dijitRuleLabelH
VerticalRuleLabel → dijitRuleLabelV
RuleMark → dijitRuleMark
HorizontalRuleMark → dijitRuleMarkH
VerticalRuleMark → dijitRuleMarkV
dijitHorizontalSliderBar → dijitSliderBarH
dijitVerticalSliderBar → dijitSliderBarV
dijitVerticalSliderBottomBumper → dijitSliderBottomBumper
dijitHorizontalSliderBumper → dijitSliderBumperH
dijitVerticalSliderBumper → dijitSliderBumperV
dijitVerticalSliderButtonContainer → dijitSliderButtonContainerV
dijitHorizontalSliderButtonContainer → dijitSliderButtonContainerH
dijitHorizontalSliderDecoration → dijitSliderDecorationH
dijitVerticalSliderDecoration → dijitSliderDecorationV
dijitHorizontalSliderImageHandle → dijitSliderImageHandleH
dijitVerticalSliderImageHandle → dijitSliderImageHandleV
dijitHorizontalSliderLeftBumper → dijitSliderLeftBumper
dijitHorizontalSliderMoveable → dijitSliderMoveableH
dijitVerticalSliderMoveable → dijitSliderMoveableV
dijitHorizontalSliderProgressBar → dijitSliderProgressBarH
dijitVerticalSliderProgressBar → dijitSliderProgressBarV
dijitHorizontalSliderRemainingBar → dijitSliderRemainingBarH
dijitVerticalSliderRemainingBar → dijitSliderRemainingBarV
dijitHorizontalSliderRightBumper → dijitSliderRightBumper
dijitVerticalSliderTopBumper → dijitSliderTopBumper
dijitSplitterHorizontal → dijitSplitterH
dijitSplitterVertical → dijitSplitterV
dijitHorizontalSliderDecrementIcon → dijitSliderDecrementIconH
dijitHorizontalSliderIncrementIcon → dijitSliderIncrementIconH
dijitVerticalSliderIncrementIcon → dijitSliderIncrementIconV
dijitVerticalSliderDecrementIcon → dijitSliderDecrementIconV


Dojox
一些杂七杂八的东西，有些早已存在又拿出来说，没有翻译……
DTL
Many improvements to the detail library. The upshot is that you can now declare widgets where the templates have for loops, if statements, etc. For example:

	templateString: '<div><input dojoAttachEvent="onkeyup: keyUp"><ul>{% for item in items %}<li>${oldRepl} {{ item }}</li>{% endfor %}</ul></div>'
	See the demos for examples.

GFX
animations for GFX, so you can animate strokes, fills, etc. See the career test example.
- sketch: a drawing program on the web

DojoX Charting
Soften your line charts by adding a "tension" property to the object used to add a plot (.addPlot); the lower the tension, the looser the curves. For best results, try a tension around 3; see the main chart test for examples.

dojox.lang.functional
new package for functional idioms like lambda, reduce, etc.

Crypto merged with encoding
The original dojox.crypto package has been merged with the newer DojoX encoding project; dojox.crypto will be entirely removed by release 1.2.

DojoX FX Easing functions
Robert Penner donated his easing functions to dojo, see the dojo-moj-oe post.

dojox.highlight
    客户端代码高亮组件，语法是<code>xxxx</code>，可以用在dojo1.0及以上版本（dojo > 0.9?)

dojox.data
new dojox.data stores

Storage
Flash storage ported from 0.4

Jaxer
???

- more NodeList animations

DojoX Widgets
New widgets:

FisheyeLight: 类似于Mac Dock的东西，比之前的版本更小巧，速度更快。
Wizard - 向导组件（上一步、下一步），从0.4来的。
ScrollPane - 根据鼠标位置自动移动的面板
DragPane - 能拖动内容的面板，就像PDF Reader
Magnifier 放大镜
CheckedMultiSelect - like a select with multiple=true but displays checkboxes for each item
Updated:

Lightbox


Util (buildscripts)

新的构建选项
   

   
• cssOptimize：设置cssOptimize=comments将去除CSS里所有空白，并根据@import规则，把所有CSS文件压缩为一行
• cssImportIgnore：设置cssOptimize里需要忽略掉的css文件。使用逗号分开，路径与@import的url一致
• buildLayers：只重新构建某些layer，用法是buildLayers=[comma separated list of layer names]
• symbol：symbol=short 和 symbol=long将为所有匿名函数添加一个名称，主要方便调试
• dojo多版本并存有一些相关选项，请参考http://dojotoolkit.org/book/book-dojo/part-3-javascript-programming-dojo-and-dijit/multiple-versions-dojo-page
• Rhino builds：指定Rhino为host environment，代替普通的浏览器环境。
   

    下载地址 http://www.dojotoolkit.org/downloads

整个dojo1.1，总体是在1.0的基础上进行了大量BUG FIX工作，据说修复了800个BUG。变动稍大的部分是widget的表单组件，由于一些方法名称、模板的变更(table->div)以及CSS的变化，对于自定义组件的影响还是挺大的，有很多自定义的CSS需要重新写，有些可能需要修改代码。
开始对过度设计进行弥补，比如SimpleTextArea这东西就是个普通的TextArea，以前的TextArea会自动改变大小，导致Grid里一行撑很高，纯粹没事找抽。Grid里移动鼠标时老是自动晃的功能也去了，谢天谢地。
在可用性方面有所提升，很多Form组件增加了布局相关的代码，比如resize方法。soria主题看起来也比原来的tundra稍微好看，不过要打到ext的那种漂亮程度和像素级精度还很远。

引用

原作者 Kenny，转载请注明出自 http://www.fyting.com，非常感谢。