js：遍历table某一tr的所有td(当鼠标放在一个单元格上时，当前行的tr样式发生变化 )
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>table的某一行td遍历</title>
<style type="text/css">
table{border-collapse:collapse; width:200px; height:100px; text-align:center; font:"宋体"; font- size:15px; color:#666666; margin:20px 20px 20px 20px }
td{ height:50px}
tr.changeCss{ color:#FFFFFF; background-color:#000000}
tr.restoreCss{ color:#000000; background-color:#FFFFFF}
</style>
<script type="text/javascript">
function changeCss1()
{
//event.srcElement设置或获取触发事件的对象。event.srcElement.parentElement获取触发事件的父标签对象
event.srcElement.parentElement.className="changeCss";
}
function restoreCss1()
{
event.srcElement.parentElement.className="restoreCss";
}
</script>
</head>
<body>
<!--遍历方式1-->
<table border="1px">
<tr onmouseover="changeCss1()" onmouseout="restoreCss1()">
<td>遍历演示0</td>
<td>遍历演示0</td>
</tr>
<tr onmouseover="changeCss1()" onmouseout="restoreCss1()">
<td>遍历演示0</td>
<td>遍历演示0</td>
</tr>
</table>
<!--遍历方式2 onmouseover当鼠标移绑定的对象时会触发的事件 onmouseout当鼠标离开时绑定的对象时会触发的事件 -->
<table border="1" onmouseover="changeCss1()" onmouseout="restoreCss1()" >
<tr onclick="alert('你觉得那一种方法好呢！')">
<td>遍历演示一 </td>
<td> 遍历演示一 </td>
</tr>
<tr onclick="alert('你觉得那一种方法好呢！')">
<td> 遍历演示一 </td>
<td> 遍历演示一</td>
</tr>
</table>
<!--附录：onmouseover与onmousemove的区别 时间上，onmousemove事件触发后再触发onmouseover事件；动作上，onmouseover只在刚进入区域时触发。onmousemove除了刚进入区域时触发外，在区域内移动鼠标也会触发-->
</body>
</html>