DOM to create <TR> & <TD>

[El Diablo]

Hi there,

I'm trying dynamically generate extra rows in a table. So far this achieves
this task within the tHead segment:

theTable.tHead.appendChild(document.createElement('TR'))

....but this only gives me table rows with no table data cells. So I would
like to know if it's possible to create several <TH> within the tHead row
using this method?

I'm new to DOM manipulation so any information or pointers would be greatly
appreciated.

- Thanks.

 

[F. Da Costa]

Hi there,

I'm trying dynamically generate extra rows in a table. So far this achieves
this task within the tHead segment:

theTable.tHead.appendChild(document.createElement('TR'))

....but this only gives me table rows with no table data cells. So I would
like to know if it's possible to create several <TH> within the tHead row
using this method?

Can't you just use the same methodology?
Create a TH (or a TD) element & append it to the TR (as many as are
required). Since the TR is already appended to the thead y'r ok.

GL
Fermin DCG

 

[Martin Honnen]

El Diablo wrote:

I'm trying dynamically generate extra rows in a table. So far this achieves
this task within the tHead segment:

theTable.tHead.appendChild(document.createElement('TR'))

...but this only gives me table rows with no table data cells. So I would
like to know if it's possible to create several <TH> within the tHead row
using this method?

I'm new to DOM manipulation so any information or pointers would be greatly
appreciated.

Well, once you know that
document.createElement('tagname')
creates an element object with that tagname and you know appendChild it
should be clear that you can store an element object reference in a
variable, append child nodes as follows:
var row = document.createElement('tr');
var cell = document.createElement('td');
cell.appendChild(document.createTextNode('Kibology.'));
row.appendChild(cell);
cell = document.createElement('td');
cell.appendChild(document.createTextNode('JavaScript'));
row.appendChild(cell);
...
Then when you are done creating table cells use appendChild on a table
or table section to append the row.

 

[El Diablo]

Exactly what I needed to know. Many thanks.

El Diablo wrote:



Well, once you know that
document.createElement('tagname')
creates an element object with that tagname and you know appendChild it
should be clear that you can store an element object reference in a
variable, append child nodes as follows:
var row = document.createElement('tr');
var cell = document.createElement('td');
cell.appendChild(document.createTextNode('Kibology.'));
row.appendChild(cell);
cell = document.createElement('td');
cell.appendChild(document.createTextNode('JavaScript'));
row.appendChild(cell);
...
Then when you are done creating table cells use appendChild on a table
or table section to append the row.