Entry
How can i change the BGCOLOR of a non id'd table ?
Apr 6th, 2008 19:28
ha mo, Russ Locke, Colin Fraser, Mikey Roach,
<html>
<head>
<script language="javascript">
// generic DOM code returns the table element from a child node
function findTableParent(node) {
var node = node.parentNode;
while (node.tagName != "TABLE") {
node = node.parentNode;
}
return node;
}
// generic DOM code returns the table element from the document
// determined by a given index
function findTableIndexed(theIndex) {
return (document.getElementsByTagName('TABLE'))[theIndex];
}
// trigger function for changing a tables background color
function changeTableColor(theTable,theColor) {
theTable.style.backgroundColor = theColor;
}
</script>
</head>
<body>
<table border=1>
<tr>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#cc0033'); return false;">Red</a></td>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#ffffff'); return false;">White</a></td>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#3366ff'); return false;">Blue</a></td>
</tr>
</table>
<br>
<table border=1>
<tr>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#339900'); return false;">Green</a></td>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#ffff00'); return false;">Yellow</a></td>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#996633'); return false;">Brown</a></td>
</tr>
</table>
<br>
<table border=1>
<tr>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#66ffcc'); return false;">Aqua</a></td>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#ff9933'); return false;">Orange</a></td>
<td><a href="javascript:void 0;" onclick="changeTableColor
(findTableParent(this),'#000000'); return false;">Black</a></td>
</tr>
</table>
<br>
<a href="javascript:void 0;" onclick="changeTableColor
(findTableIndexed(0),'#ff00cc'); return false;">Pink</a> (1st table =
index 0)
<br>
<a href="javascript:void 0;" onclick="changeTableColor
(findTableIndexed(1),'#999999'); return false;">Grey</a> (2nd table =
index 1)
<br>
<a href="javascript:void 0;" onclick="changeTableColor
(findTableIndexed(2),'#660099'); return false;">Purple</a> (3rd table =
index 2)
</body>
</html>
http://www.businessian.com
http://www.computerstan.com
http://www.financestan.com
http://www.healthstan.com
http://www.internetstan.com
http://www.moneyenews.com
http://www.technologystan.com
http://www.zobab.com
http://www.healthinhealth.com
