javascript学习实录 之七（实现鼠标移动上去后表格颜色变化）

废话不说，直接上代码，css部分，实在是无力，简单搞搞样式，意思到就好

[javascript] view plain copy

"Content-Type" content="text/html; charset=utf-8" />


    "text/css">
        table {
            border: blue solid 1px ;
        }
        table tr {
            border: aqua solid 1px;
            background-color: blueviolet;
        }
        .one {
            background-color: #33FFCC;
        }
        .two {
            background-color: #FFFF66;
        }
        .over {
            background-color: brown;
        }


    "text/javascript">
        var name;
        function trcole() {
            var tabNode = document.getElementsByTagName("table")[0];
            var trs = tabNode.rows;
            for(var x=1; x
                if(x % 2 ==1) {
                    trs[x].className = "one";
                } else {
                    trs[x].className = "two";
                }

                trs[x].onmouseover = function() {
                    name = this.className;
                    this.className = "over";
                }
                trs[x].onmouseout = function () {
                    this.className = name;
                }

            }
        }
        window.onload = trcole;



                                                                                                                                                                                                                                                                                                                                         
    
   姓名 
   "javascript:void(0)" οnclick="sortTab()">年龄 
   地址 
    
    
    
   张三11 
   35 
   北京 
    
    
    
   张三22 
   24 
   北京 
    
    
    
   张三33 
   68 
   北京 
    
    
    
   张三44 
   90 
   北京