jquery实现的隔行变色代码实例:隔行变色效果在大量的网站应用，尤其是表格或者新闻列表之类的结构，可以有效增强网站的辨识度,更为人性化，下面通过一个简单的实例介绍一下它的实现原理，至于它的美观度这里就不讲究了，代码实例如下:<!DOCTYPE html><ht ...
jquery实现的隔行变色代码实例:
隔行变色效果在大量的网站应用，尤其是表格或者新闻列表之类的结构，可以有效增强网站的辨识度,更为人性化，下面通过一个简单的实例介绍一下它的实现原理，至于它的美观度这里就不讲究了，代码实例如下:
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">table{ width:300px;}caption{ background:#DCA;}th{ background:#FCA; width:50%;}td{ text-align:center;}</style><script type="text/javascript" src='/images/loading.gif' data-original="mytest/jQuery/jquery-1.8.3.js"></script><script type="text/javascript"> $(document).ready(function(){ odd= {"background":"#EDA","color":"#3F5"}; even={"background":"#2DA","color":"#875"}; odd_even("#table_test",odd,even); }); function odd_even(id,odd,even){ $(id).find("tr").each(function(index,element){ if(index%2==1){ $(this).css(odd); } else{ $(this).css(even); } })} </script></head><body><table id="table_test"> <caption>表格标题</caption> <tr> <th>网站名称</th> <th>网站所在地</th> </tr> <tr> <td>蚂蚁部落</td> <td>青岛市南</td> </tr> <tr> <td>蚂蚁部落</td> <td>青岛市南</td> </tr> <tr> <td>蚂蚁部落</td> <td>青岛市南</td> </tr> <tr> <td>蚂蚁部落</td> <td>青岛市南</td> </tr> <tr> <td>蚂蚁部落</td> <td>青岛市南</td> </tr> <tr> <td>蚂蚁部落</td> <td>青岛市南</td> </tr> <tr> <td>蚂蚁部落</td> <td>青岛市南</td> </tr> <tr> <td>蚂蚁部落</td> <td>青岛市南</td> </tr></table></body></html>
原标题：jquery实现的隔行变色代码实例
关键词：jquery
*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：
admin#shaoqun.com
（#换成@）。
