首页 > 代码库 > jquery实现奇偶行赋值不同css值

jquery实现奇偶行赋值不同css值

2024-07-04 14:16:45   224人阅读


<html> 
<head> 
　　<title>jquery奇偶行css效果</title> 
　　<script src="../../jquery/jquery.js" type="text/javascript"></script> 

　　<style type="text/css"> 
　　　　/*table中偶数行*/ 
　　　　.tabEven 
　　　　{ 
　　　　　　background: #9d8e8b; 
　　　　} 
　　　　/*table中奇数行*/ 
　　　　.tabOdd 
　　　　{ 
　　　　background: #ffffff; 
　　　　} 
　　</style>

　　<script type="text/javascript"> 
　　　　$(document).ready(function () { 
　　　　　　$("#datalist tr:even").addClass("tabEven");//给偶数行加样式 
　　　　　　$("#datalist tr:odd").addClass("tabOdd"); //给奇数行加样式
　　　　}); 
　　</script> 
</head> 
<body> 
　　<table id="datalist"> 
　　　　<tr><td>第1行</td></tr> 
　　　　<tr><td>第2行</td></tr> 
　　　　<tr><td>第3行</td></tr> 
　　　　<tr><td>第4行</td></tr> 
　　　　<tr><td>第5行</td></tr> 
　　</table> 
</body> 
</html>

 


联系
我们