求助:javascript 中变色的实现

[selila]

代码如下
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#336699" onmouseover="this.style.backgroundColor='#f0f0f0'"
onmouseout="this.style.backgroundColor=''"><a href="#" ><font color="#FFFFFF" onmouseover="this.style.color='#003399'" onmouseout="this.style.color=''">新闻</font></a></td>
</tr>
</table>

目前的代码只实现鼠标移动到<td>标签区域的时候改变背景颜色。同时移动到新闻二个字上改变字的颜色

我想让鼠标移动到<td>标签区域但是没有移动到新闻二个字上的时候改变背景颜色。同时也改变新闻二个字的颜色。
请问这样的效果能实现吗？如果可以能说说怎么弄吗？

[woyingjie]

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#336699" onmouseover="this.style.backgroundColor='#f0f0f0';a.style.color=

'#003399'" onmouseout="this.style.backgroundColor='';a.style.color=''"><a href="#" id=a>新

闻</a></td>
</tr>
</table>

[wanghr100]

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#336699" onmouseover="overbao(this)"
onmouseout="outbao(this)"><a href="#" ><font color="#FFFFFF">新闻</font></a></td>
</tr>
</table>
<script>
function overbao(obj)
{
obj.style.backgroundColor='#f0f0f0'
obj.firstChild.firstChild.color='#003399'
}
function outbao(obj)
{
obj.style.backgroundColor=''
obj.firstChild.color=''
}
</script>