表格过滤器

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>表格过滤器</title>

<script language="javascript" src="../MyfirstjQueryFileWord/jquery-1.10.2.js">

</script>

<script language="Javascript">$(function(){/*//第一种方法

$('.a').CSS('background','#f00');

$('.b').css('background','#f0f');

$('.c').css('background','#00f');

$('.d').css('background','#ff0');

$('.e').css('background','#f0f');*//*//第二种方法

$('table tr:first').css('background-color','#f00');

$('table tr:last').css('background-color','#f00');

$('table tr:odd').css('background-color','#f00');*/$('table tr:even').css('background-color','#f00');

});/*当鼠标移到表格上是，当前一行背景变色*/$(document).ready(function(){

$(".data_list tr td").mouSEOver(function(){

$(this).parent().find("td").css("background-color","#d5f4fe");

});

})/*当鼠标在表格上移动时，离开的那一行背景恢复*/$(document).ready(function(){

$(".data_list tr td").mouseout(function(){varbgc = $(this).parent().attr("bg");

$(this).parent().find("td").css("background-color",bgc);

});

})</script>

</head>

<body>

<center>

<table width="500" border="1" height="500">

<tr>

<td class="a">&nbsp;</td>

</tr>

<tr>

<td class="b">&nbsp;</td>

</tr>

<tr>

<td class="c">&nbsp;</td>

</tr>

<tr>

<td class="d">&nbsp;</td>

</tr>

<tr>

<td class="e">&nbsp;</td>

</tr>

</table>

</center>

</body>

</html>