experiments/dom.html [103:149]:
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        function elt(parent, name, className, content) {
            var el = document.createElement(name);
            if (content) {
                el.appendChild(document.createTextNode(content))
            }
            parent && parent.appendChild(el)
            el.className = className
            return el;
        }
        function txtEl(parent, str) {
            return parent.appendChild(document.createTextNode(str))
        }
        function clearEl(el, l) {
            while (l --> 0)
                el.removeChild(el.lastChild);
        }

        
        function update(rootEl, lines) {
            var ch = rootEl.childNodes
            for (var i = 0; i < lines.length; i++) {
                if (ch[i]) {
                    var el = ch[i]
                    el.className = "line"
                }
                else
                    var el = elt(rootEl, "div", "line")
                renderLine(el, lines[i])
            }
            clearEl(rootEl, ch.length - i)
        }
    
        function renderLine(rootEl, tokens) {
            var ch = rootEl.childNodes
            for (var i = 0; i < tokens.length; i ++) {
                if (ch[i]) {
                    var el = ch[i]
                    el.className = tokens[i]
                    el.firstChild.nodeValue = tokens[i]
                }
                else
                    elt(rootEl, "span", tokens[i], tokens[i])
            }
            clearEl(rootEl, ch.length - i)
        }
        return update;
    }
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -



experiments/dom.html [297:343]:
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        function elt(parent, name, className, content) {
            var el = document.createElement(name);
            if (content) {
                el.appendChild(document.createTextNode(content))
            }
            parent && parent.appendChild(el)
            el.className = className
            return el;
        }
        function txtEl(parent, str) {
            return parent.appendChild(document.createTextNode(str))
        }
        function clearEl(el, l) {
            while (l --> 0)
                el.removeChild(el.lastChild);
        }

        
        function update(rootEl, lines) {
            var ch = rootEl.childNodes
            for (var i = 0; i < lines.length; i++) {
                if (ch[i]) {
                    var el = ch[i]
                    el.className = "line"
                }
                else
                    var el = elt(rootEl, "div", "line")
                renderLine(el, lines[i])
            }
            clearEl(rootEl, ch.length - i)
        }
    
        function renderLine(rootEl, tokens) {
            var ch = rootEl.childNodes
            for (var i = 0; i < tokens.length; i ++) {
                if (ch[i]) {
                    var el = ch[i]
                    el.className = tokens[i]
                    el.firstChild.nodeValue = tokens[i]
                }
                else
                    elt(rootEl, "span", tokens[i], tokens[i])
            }
            clearEl(rootEl, ch.length - i)
        }
        return update;
    }
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -