createElement + createTextNode oneliner?

Question

I\'m adding a few thousand rows to a table so i need the speed of native javascript for this one.

Currently I\'m using:

nThName = document.createElement(         


        

Answer 1

like David Thomas suggested.. a helper function is clearly the best option:

nTr.appendChild(newElement("TH", workers[i].name));

function newElement(TagName, TextContent, ClassName) {
    var nTag = document.createElement(TagName);
    nTag.className = ClassName;
    nTag.appendChild(document.createTextNode(TextContent));
    return nTag;
}

Changed it with advice by Florian Margaine. Result is super fast. MANY times faster then pure knockout or jquery.

var tplTbody = document.createElement("TBODY");
var tplTr = document.createElement("TR");
var tplTd = document.createElement("TD"); // Every element used has it's 'template'

var nTbody = tplTbody.cloneNode();
for(var i in rows) {
    var nTr = newElement(tplTr.cloneNode(), null, "someclass");
    for(var i in cells) {
        nTr.appendChild(newElement(tplTd.cloneNode(), cell[i].content);
    }
    nTbody.appendChild(nTr);
}
document.getElementById("myTable").appendChild(nTbody);


function newElement(Tag, TextContent, ClassName) {
    if (TextContent !== undefined && TextContent != null)
        Tag.appendChild(document.createTextNode(TextContent));
    if (ClassName !== undefined && ClassName != null) 
        Tag.className = ClassName;
    return Tag;
}