jQuery实现table隔行换色和鼠标经过变色的两种方法

  一、隔行换色

  

复制代码 代码如下:

  $("tr:odd").css("background-color","#eeeeee");

  $("tr:even").css("background-color","#ffffff");

  或者一行搞定:

  

复制代码 代码如下:

  $("table tr:nth-child(odd)").css("background-color","#eeeeee");

  :nth-child 匹配其父元素下的第N个子或奇偶元素

  二、鼠标经过变色

  

复制代码 代码如下:

  $("tr").live({

  mouseover:function(){

  $(this).css("background-color","#eeeeee");

  },

  mouseout:function(){

  $(this).css("background-color","#ffffff");

  }

  })

  或者

  

复制代码 代码如下:

  $("tr").bind("mouseover",function(){

  $(this).css("background-color","#eeeeee");

  })

  $("tr").bind("mouseout",function(){

  $(this).css("background-color","#ffffff");

  })

  当然live()和bind()都可以同时绑定多个事件或分开。