id 和 data-dojo-id 之间的区别

Question

像这样的dojo标签中的id和data-dojo-id有什么区别：

<button id="save" data-dojo-type="dijit/form/Button" type="button" data-dojo-attach-event="onClick:save">Save</button>

我尝试引用此按钮来更改它的标签： var myButton = dijit.byId("save"); 这样我就可以更改按钮标签 myButton.set("label", "Add New");

如果我使用 id="save" 它可以工作。如果我只使用 data-dojo-id="save" 它不起作用。

我对 Dojo 还很陌生，因此非常感谢您指点我的解释或教程！

Answer 1

data-dojo-id 将小部件分配到全局命名空间，即分配到 window 对象：

<button data-dojo-id="save" data-dojo-type="dijit/form/Button">Save</button>​

所以你可以直接访问按钮：

save.set("label", "Add New");

在 jsFiddle 上查看不同之处：http://jsfiddle.net/phusick/7yV56/

编辑：回答您的问题。我根本不使用data-dojo-id。它污染了与 AMD 所做的完全相反的全局命名空间。无论如何，您仍然可以使用 widgets.save 和 widgets.rename 之类的东西来尽量减少污染：

<button data-dojo-id="widgets.save" data-dojo-type="dijit/form/Button">Save</button>​
<button data-dojo-id="widgets.rename" data-dojo-type="dijit/form/Button">Rename</button>​

IMO，data-dojo-id 用于progressive enhancement，而不是用于成熟的应用程序。

data-dojo-id 只是将一个实例分配给一个变量，因此对于具有相同 data-dojo-id 的多个 dijit，该变量将指向最后一个分配的变量（即它不会是一个数组）。

您可以避免大量使用registry.byId，根据您的需要编写获取小部件的方法。最好的开始方式是dijit/registy.findWidgets(rootNode, skipNode)。另请注意，dojo/parser.parse(rootNode, options) 返回一个实例化对象数组，或更准确地说：

返回一个混合对象，它是实例化对象的数组， 但也可以包含一个通过实例化解决的承诺 对象。这样做是为了向后兼容。如果解析器 auto-requires 模块，它将始终以承诺的方式运行，并且 应该使用parser.parse().then(function(instances){...})。

我用来将 ContentPane 的 dijit 分配给它的 widgets 属性的方法示例，该属性是一个对象：

_attachTemplateWidgets: function(widgets) {
    widgets = widgets || this.getChildren();
    for(var each = 0; each < widgets.length; each++) {
        var widget = widgets[each];
        var attachPoint = widget.params.dojoAttachPoint;
        if(attachPoint) {
            this.widget[attachPoint] = widget;
        }

        var children = widget.getChildren();
        if(children.length > 0) {
           this._attachTemplateWidgets(children);
        }
    }
}

我把整个班级都放在这里：https://gist.github.com/3754324。我使用这个app.ui._Pane 而不是dijit/layout/ContentPane。