RE: Appending to table cells

Tech-Archive recommends: Fix windows errors by optimizing your registry



"SharkD" wrote:

The following page works in Firefox but not in IE7:

http://www.geocities.com/mikehorvath.geo/html_table_cell_append_test.html

Oh! I remember now! MSIE doesn't allow you to create table elements using
createElement! You have to use insertRow and insertCell!

Thus:

<html>
<head>
<style>
table { border: solid black 1px; }
th { background-color: pink; }
</style>

<script>
function dothis()
{
var cell = document.getElementById('th1');

var newTable = document.createElement('table');
var newRow = newTable.insertRow( );
var newCell1 = newRow.insertCell( );
var newCell2 = newRow.insertCell( );
var newText = document.createTextNode('trumpet')
while (cell.hasChildNodes())
newCell1.appendChild(cell.removeChild(cell.firstChild));

newCell2.appendChild(newText);
cell.appendChild(newTable);
document.getElementById("show").innerText =
document.getElementById("tbl").innerHTML;
}
</script>
</head>

<body>

<input type="button" value="click" onclick="dothis()"/>
<table id="tbl">
<tr>
<th id="th1">header</th>
</tr>
</table>
<hr>
<div id="show"></div>
</body>
</html>

Of course, *THAT* code bombs out on Firefox. Isn't browser compatibility fun?




.

Quantcast