ajax+js+dom实现隔行变色效果

 Interlaces.css

.top{

      background-color:#F00;  
      color:#006;
  }
 table{
      border:1px #C06 dashed;
      border-collapse:collapse;
  }
 th,td{
      border:#999 1px solid;
      
  }
  .one{
      background-color:#ffc;
  }
  .two{
      background-color:#fcc;
  }
  .over{
      background-color:#666;

  }

Interlaces.js

function Interlaces(){
     //获取id=Interlaces_tab表格的所有的行
     var interlaces_tab=document.getElementById("Interlaces_tab");
     //获取所有的tr    
     var trlist=document.getElementsByTagName("tr");
     for(var i=1;i<trlist.length;i++){
    
     //进行遍历，并且判断
       if(i%2==0){
           trlist[i].className="two";   
       }else{
           trlist[i].className="one";
       }
           
       var oldcolor;
       //实现当鼠标移动到该行，该行背景加深、
       trlist[i].οnmοuseοver=function(){
           oldcolor=this.className;
           //onmouseover会传匿名函数 this--将鼠标移上去会获取当前值
           //重新设置新颜色
         this.className="over";  
       }
        trlist[i].οnmοuseοut=function(){
           //当鼠标离开，自动还原颜色
           
         this.className=oldcolor;   
       }       
     }
   }