CSS formatting DOM table cells. Help. [Archive]

contiw

07-12-2004, 12:16 AM

The following code add rows and cells nicely in a table.
I need to apply some css formatting like fontfamily, fontsize, padding, etc., to the cells. Please advise.

<html>
<head>
<script language="JavaScript" type="text/javascript">
function addRow(id){
var tbody = document.getElementById
(id).getElementsByTagName("TBODY")[0];
var row = document.createElement("TR")
var td1 = document.createElement("TD")
td1.appendChild(document.createTextNode("efgh"))
var td2 = document.createElement("TD")
td2.appendChild (document.createTextNode("5678"))
row.appendChild(td1);
row.appendChild(td2);
tbody.appendChild(row);
}

</script>
</head>
<body>
<br><br><br>
<a href="#" onclick="addRow('myTable');return false;">Add row</a>
<table id="myTable" cellspacing="0" border="1">
<tbody>
<tr>
<td>abcd</td><td>1234</td>
</tr>
</tbody>
</table>

</body>
</html>

sad69

07-12-2004, 08:45 PM

Would you like to elaborate on that a little?

Like what CSS? Have you got some style classes together already or are you asking for our advice as to 'what looks good'?

Or are you asking where/how you would change CSS attributes? This is one we can help you out with:

row.className = 'cssClassName';
row.setAttribute('className', 'cssClassName');
row.style.bgColor = 'blue';

Hope that helps,
Sadiq.