insert element at the end of a node

[strauchdieb]

hey,

i'm a little frustrated. i'm trying to add a td element with
appendChild as last child to a tr element. but it adds the td element
always as first child to the tr element?
although appendChild should add the new child at the end. what could be
wrong?

[Martin Honnen]

strauchdieb wrote:

i'm trying to add a td element with
appendChild as last child to a tr element. but it adds the td element
always as first child to the tr element?
although appendChild should add the new child at the end. what could be
wrong?

Show us the relevant code (script and HTML), then tell us which
browser(s) you are testing with, then we can probably help.
--

Martin Honnen
http://JavaScript.FAQTs.com/

[strauchdieb]

oh sorry, i've totally forgotten to post the code. sorry...

here's the code:

for (var i = 0; i < tableBody.rows.length; i++)
{
var cell = document.createElement("td");
tableBody.rows[i].appendChild(cell);
}

that's nothing fancy, i think.
i tested it with IE and firefox

[Evertjan.]

strauchdieb wrote on 07 okt 2006 in comp.lang.javascript:

oh sorry, i've totally forgotten to post the code. sorry...

here's the code:

for (var i = 0; i < tableBody.rows.length; i++)
{
var cell = document.createElement("td");
tableBody.rows[i].appendChild(cell);
}

that's nothing fancy, i think.
i tested it with IE and firefox

Since you did not quote, we have to search back to your Q.

Please always quote on usenet.

it was:

i'm a little frustrated. i'm trying to add a td element with
appendChild as last child to a tr element. but it adds the td element
always as first child to the tr element?
although appendChild should add the new child at the end. what could be
wrong?

Nothing is wrong, try the following:

<table id='tableBody' border='1'>
<tr><td>mmmmm
<tr><td>mmmmm
<tr><td>mmmmm
<tr><td>mmmmm
</table>

<script type='text/javascript'>
var tableBody = document.getElementById('tableBody')
for (var i = 0; i < tableBody.rows.length; i++){
var cell = document.createElement("td");
tableBody.rows[i].appendChild(cell);
cell.innerHTML = 'Hello!'
}
</script>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Martin Honnen]

strauchdieb wrote:

for (var i = 0; i < tableBody.rows.length; i++)
{
var cell = document.createElement("td");
tableBody.rows[i].appendChild(cell);
}

i tested it with IE and firefox

I don't see anything wrong with the code snippet, but I don't see
anything wrong with the results I get with
<http://home.arcor.de/martin.honnen/javascript/2006/10/test2006100801.html>
which uses the code snippet (with one variation to allow to put some
content in the newly created cells). The only problem is that IE 6 does
not render borders around empty cells thus if the above is all you
really do then you will not see much at the end of the row looking like
an empty cell, but still you see the change at the end of the row and
not at the beginning as you original post claimed.

--

Martin Honnen
http://JavaScript.FAQTs.com/

[strauchdieb]

it inserts the new td's definitely as first child.

my table html looks like this, before inserting with appendChild:
<TABLE>
<TBODY>
<TR>
<TH>1</TH>
<TD id=1x1></TD>
<TD id=1x2></TD>
<TD id=1x3></TD>
</TR>
</TBODY>
</TABLE>

after inserting it looks like this:
<TABLE>
<TBODY>
<TR>
<TH>1</TH>
<TD>inserted</TD>
<TD>inserted</TD>
<TD>inserted</TD>
<TD id=1x1></TD>
<TD id=1x2></TD>
<TD id=1x3></TD>
</TR>
</TBODY>
</TABLE>

what i want is:
<TABLE>
<TBODY>
<TR>
<TH>1</TH>
<TD id=1x1></TD>
<TD id=1x2></TD>
<TD id=1x3></TD>
<TD>inserted</TD>
<TD>inserted</TD>
<TD>inserted</TD>
</TR>
</TBODY>
</TABLE>

has anybody an idea, how i can make this happen? is there a workaround
for this problem?

thanks for your help

Evertjan. wrote:

strauchdieb wrote on 07 okt 2006 in comp.lang.javascript:

oh sorry, i've totally forgotten to post the code. sorry...

here's the code:

for (var i = 0; i < tableBody.rows.length; i++)
{
var cell = document.createElement("td");
tableBody.rows[i].appendChild(cell);
}

that's nothing fancy, i think.
i tested it with IE and firefox

Since you did not quote, we have to search back to your Q.

Please always quote on usenet.

it was:

i'm a little frustrated. i'm trying to add a td element with
appendChild as last child to a tr element. but it adds the td element
always as first child to the tr element?
although appendChild should add the new child at the end. what could be
wrong?

Nothing is wrong, try the following:

<table id='tableBody' border='1'>
<tr><td>mmmmm
<tr><td>mmmmm
<tr><td>mmmmm
<tr><td>mmmmm
</table>

<script type='text/javascript'>
var tableBody = document.getElementById('tableBody')
for (var i = 0; i < tableBody.rows.length; i++){
var cell = document.createElement("td");
tableBody.rows[i].appendChild(cell);
cell.innerHTML = 'Hello!'
}
</script>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Evertjan.]

strauchdieb wrote on 08 okt 2006 in comp.lang.javascript:

it inserts the new td's definitely as first child.

[Please do not toppost on usenet]

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)