onMouseOver时，设置单元格边框的问题

L@_@K！ <body>
  <table id="tabTest">
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
    </tr>
    <tr>
        <td>4</td>
        <td>5</td>
        <td>6</td>
    </tr>
    <tr>
        <td>7</td>
        <td>8</td>
        <td>9</td>
    </tr>
  </table>
<script type="text/javascript">
<!--
var oTable = document.getElementById("tabTest");
var colCells = oTable.cells;
for (var i=0; i<colCells.length; i++)
{
    colCells[i].onmouseover = function ()
    {
        if (this.style.border == "")
        {
            var oTable = this.parentNode.parentNode.parentNode;
            
            for (var i=0; i<oTable.cells.length; i++)
            {
                oTable.cells[i].style.border = "1px solid red";
            }            
        };
    }
}
//-->
</script>
 </body>