以编程方式添加标签

Posted 2023-02-16

【中文标题】以编程方式添加标签

【英文标题】：Add labels programmatically

【发布时间】：2011-03-23 09:42:48

【问题描述】：

我有一个 div id="container" 容器，我需要向该 div 添加标签（10 或 4 或一个 - 取决于我单击哪个按钮）并且需要看起来像表格（行 x 2 列）。如何做到这一点？ 如何？

【参考方案1】：

您可以使用 dojo.create 函数。例如：

var label = dojo.create("label", for:"fieldId", innerhtml:"SomeText", "tableCellId");

where tableCellId - 要在其中附加标签的元素的 ID

同样，您可以动态创建表格，并为新表格添加标签。

var table = dojo.create("table", null, dojo.body());
var row = dojo.create("tr", null, table);
var cell = dojo.create("td", null, row);
var label = dojo.create("label", for:"fieldId", innerHTML:"SomeText", cell);

Dojo create documentation

【参考方案2】：

这是我在道场中的做法。

dojo.place('<label for="field">Field Name</label>', dojo.byId('widget_fieldId'), 'before');

【参考方案3】：

我发现我需要在创建 TextEntry 元素之前将标签添加到容器中，但引用了 TextEntry 元素的 id。

以下是我为编辑器添加标签的示例：

var tabWizard = new TabContainer(
   id : "tabWizard",
   class : "centerTabContainer",
   tabPosition : "left"
);
var tab = new ContentPane(
   title : "tabTitles",
   class : "tabPage"
);
tabWizard.addChild(tab);
var tabContainer = new BorderContainer(
   design : 'headline',
   gutters : false
);
var tabMain = new ContentPane(
   
      id : "tabMain_What",
      class : "cdmMain",
      region : "center"
   );
tabMain.startup();
// here is where the label is created referencing the id details
tabMain.domNode.appendChild(
   dojo.create("label",
      "for" : "details", innerHTML : "Details:" 
    )
);
// here is the editor to be labeled as "Details:"
var tabPrompt = new Editor(
   id : "details",
   name : "details",
   class : "details"
);
tabMain.addChild(tabPrompt);
tabContainer.addChild(tabMain);
tab.addChild(tabContainer);