Динамически Div в додзе

Question

Я пытаюсь написать динамически Div в додзе, количество дивы, зависит от величины count Div должны быть вставки под <div data-dojo-type="dijit/layout/TabContainer" id="maintab" style="width:100%; height:100%;">

Мои динамически DIVS сусло выглядит как <div data-dojo-type="dijit/layout/ContentPane" data-dojo-id="dtab" title="title" data-dojo-props="selected:false"> (с точки зрения это закладка)

Мой вопрос заключается в том, как сделать функцию с конкретным , id и title на данный момент у меня есть `

function myFunction() { 
var node = dojo.doc.getElementById('maintab'); 
node.appendChild += "<div data-dojo-type='dijit/layout/ContentPane' data-dojo-id='testTab' title='test' data-dojo-props='selected:false' >sample text</div>"; 
} 
` 

Answer 1

Что вы используете, это неверно. appendChild - это функция, которую вы должны вызывать, и получает узел DOM. Применение конкатенации строк непосредственно к appendChild не имеет смысла в этом контексте (и конкатенация innerHTML, с которой вы, вероятно, сбиваете с толку, в любом случае становится очень громоздкой).

Кроме того, вы говорите о динамическом добавлении декларативной разметки виджета, но, вероятно, это будет иметь гораздо больший смысл и быть намного более прямым, чтобы просто программно создавать каждый ContentPane. В противном случае вам также понадобится запустить анализатор над декларативной разметкой после ее создания.

Также не имеет смысла назначать каждому дочернему ContentPane одно и то же имя переменной, которое вы бы невольно делали, устанавливая тот же статический data-dojo-id каждый раз.

maintab Если уже разобраны и инстанцирован как TabContainer, вы могли бы сделать что-то вроде следующего (я предполагаю, что Dojo 1.6 или более ранней версии кода стиля, так это то, что вы использовали выше):

function addChild(title) { 
    var container = dijit.byId('maintab'); 
    var child = new dijit.layout.ContentPane({ title: title }); 
    container.addChild(child); 
    return child; 
} 

Если типы дочерних виджетов также могут различаться, вы могли бы передать, что в тоже (этот пример предполагает, что вы можете передать в той или иной аргументы для каждого):

function addChild(Constructor, args) { 
    var container = dijit.byId('maintab'); 
    var child = new Constructor(args); 
    container.addChild(child); 
    return child; 
} 
// Usage e.g. addChild(dijit.layout.ContentPane, { title: 'Hello' }) 

Если по какой-то причине, вы действительно нуждаетесь/хотите для создания декларативного HTML перед контактированием ner анализируется, вы можете сделать примерно следующее:

function addChildMarkup(moduleId, argsString) { 
    // Notice dojo.byId used here to retrieve DOM node 
    // (vs. dijit.byId in earlier examples to retrieve widget instance) 
    var container = dojo.byId('maintab'); 
    return dojo.create('div', { 
     'data-dojo-type': moduleId, 
     'data-dojo-props': argsString 
    }, container); 
} 
// Usage: addChildMarkup('dijit.layout.ContentPane', '{ title: "Hello" }')