Alla fine l'unica cosa che cambia è come vuoi che le istruzioni vengano utilizzate ed estese. Questi sono un po' diversi dai precedenti, ma una cosa importante è che appendChild
non dovrebbe essere dentro il ciclo degli attributi delle istruzioni per il nodo ma subito dopo al di fuori di esso; bisogna prestare attenzione anche ad alcuni attributi speciali, forse class
non è l'unico, chissà :) ...provate a sostituire completamente il for block
interno con quanto segue:
var tag = null, a;
if ('tag' in _instr) {
tag = document.createElement(_instr.tag);
if ('attributes' in _instr)
for(a in _instr.attributes) {
a.match(/^class$/) && (a = 'className');
tag.setAttribute(a,_instr.attributes[a]);
}
if ('events' in _instr)
for(a in _instr.events)
tag.addEventListener(a,_instr.events[a], false);
//
// if ('content' in _instr && _instr.content!==null)
// tag.innerHTML = _instr.content;
//
// but take care ... what if is a input[text]
tag[_instr.tag=='input' ? 'value' : 'innerHTML'] = ('content' in _instr && _instr.content !== null) ? _instr.content : o[k];
if ('children' in _instr)
for(a in _instr.children)
_(_instr.children[a], a, tag);
!!_n && !!tag && _n.appendChild(tag);
}
====================
AGGIORNATO
Ora l'output ora è esattamente quello previsto. Ho anche corretto uno stupido bug durante la gestione della class
attributo. Provalo, forse anche su altri input, ho provato a mettere testo invece di null su alcuni dati e sembra a posto. Ci vediamo!
function assemble (data, instr) {
var n = document.createDocumentFragment(), i;
function create(d) {
return (function _(_instr, _d, _key, _n) {
var tag = null, i;
if ('tag' in _instr) {
tag = document.createElement(_instr.tag);
tag.innerHTML = 'content' in _instr && !!_instr.content ? _instr.content : typeof _d == 'string' ? _d : '';
if ('attributes' in _instr)
for (i in _instr.attributes)
tag.setAttribute(i, _instr.attributes[i]);
if ('events' in _instr)
for(i in _instr.events)
tag.addEventListener(i,_instr.events[i], false);
//recur finally
if ('children' in _instr) {
for (i in _instr.children){
_(_instr.children[i], _d[i], i, tag);
}
}
!!_n && _n.appendChild(tag);
}
return tag;
})(instr, d, null);
}
return (function (){
for (i in data) {
n.appendChild(create(data[i]));
}
return n;
})();
}