I'm surprised we have no tutorial on it.
I don't want to go into too much detail right now, but here's a brief summary of a few functions you'll need to know for dealing with creating tables via DOM methods:
appendChild
insertBefore
document.createElement
cloneNode
insertRow
insertCell
Basically, I'll try to summarize them briefly here for you... won't go into too much depth, sorry.
PARENT.appendChild(CHILDNODE)
That'll add a childnode to the END of the parent node.
ELEMENT.parentNode.insertBefore(NEWNODE, ELEMENT)
This will insert NEWNODE before ELEMENT
document.createElement("div")
That'd create a new DIV node that you can assign to a variable. Then you could edit properties, append, insert before something, etc.
NODE.cloneNode(true);
I can't remember the EXACT differences between true and false, but this basically clones NODE and returns it so you can put it in a variable or something. The true vs false involves copying properties and child nodes. I don't want to give specifics because I can't remember exact details.
Just look it up on MozDev
TABLE.insertRow(POS);
ROW.insertCell(POS);
Just read this:
forum.sz-ex.com/index.cgi?action=display&board=codetuts&thread=2068More on appendChild and insertBefore:
forum.sz-ex.com/index.cgi?action=display&board=codetuts&thread=2087Hopefully that'll help you figure it out. >.< I'll try to write a tutorial sometime in the future on it. Also, I find it -very- helpful to learn by dissection of other codes, so try looking at these by me:
forum.sz-ex.com/index.cgi?board=codes&action=display&thread=1357forum.sz-ex.com/index.cgi?board=codes&action=display&thread=1511forum.sz-ex.com/index.cgi?board=codes&action=display&thread=11639