用jQuery实现鼠标在table上移动进行样式变化

1、定义样式

<style type="text/css">

   .striped
       {
           background-color:red;
       }
 .over
 {
  background-color:#BEBEBE;
 }

 

2、定义事件

<script type="text/javascript">

$(document).ready(function(){

 

$("table tr:nth-child(even)").addClass("striped");   偶数行 变化

 

$("table tr:nth-child(odd )").addClass("striped");   奇数行 变化

 
$("tr").mouseover(function(){
     $(this).addClass("over");
    });
    
    $("tr").mouseout(function() {
     $(this).removeClass("over");
    });

 

});
 </script>