Calling CSS class from javascript [Archive]

vnewbee

03-06-2009, 02:55 AM

I created this sample table to test this. the style doesn't get applied. but if i remove this scripting (function) and just test with html tags, the styles are geting applied. Am i calling the css classes in the wrong way??

<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="test.css"/>
<script type="text/javascript">

function table()
{
document.write("<TABLE CLASS=\"MYTABLE\">");
document.write("<CAPTION CLASS=\"MYTABLE\">Table Caption</CAPTION>");

document.write("<THEAD >");
document.write("<TR CLASS=\"MYTABLE\">");
document.write("<TH CLASS=\"MYTABLE\">Column One</TH>");
document.write("<TH CLASS=\"MYTABLE\">Column Two</TH>");
document.write("<TH CLASS=\"MYTABLE\">Column Three</TH>");
document.write("</TR>");
document.write("</THEAD>");

document.write("<TR CLASS=\"MYTABLE\">");
document.write("<TD CLASS=\"MYTABLE\">Row 1, Column 1</TD>");
document.write("<TD CLASS=\"MYTABLE\">Row 1, Column 3</TD>");
document.write("<TD CLASS=\"MYTABLE\">Row 1, Column 3</TD>");
document.write("</TR>");

document.write("</TABLE>");
}
</script>
</head>
<body onload="table()">
</body>
</html>

Fang

03-06-2009, 05:09 AM

Using document.write after the page loads will write a new document. The styles do not exist in the new document.

Charles

03-06-2009, 08:46 AM

See http://www.w3.org/TR/REC-DOM-Level-1/ and be careful with JavaScript. It doesn't work for a lot of users so make sure your page has some sort of JavaScript free backup for the content.