Posted in Javascript onNovember 19, 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>even and odd</title> <script type="text/javascript" src="jquery-1.4.4.js"></script> <script type="text/javascript" language="javascript"> $(function(){ alert("第一种"); $("tbody tr:even").css("background-color", "red"); $("tbody tr:odd").css("background-color", "yellow"); alert("第二种"); $("tbody tr").each(function (index){ alert(index); if(0 == index%2) { $(this).css("background-color", "blue"); } if(1 == index%2) { $(this).css("background-color", "green"); } }); alert("第三种"); rows = document.getElementsByTagName("tr"); var length = rows.length; for(var i=0; i< length;i++){ alert(i); if(0==i%2){ rows[i].style.backgroundColor="#ffff00"; }else { rows[i].style.backgroundColor="#0000FF"; } } }); </script> </head> <body> <table border="1"> <tbody > <tr> <td>aaa</td> <td>aaa</td> <td>aaa</td></tr> <tr> <td>bbb</td> <td>bbb</td> <td>bbb</td></tr> <tr> <td>aaa</td> <td>aaa</td> <td>aaa</td></tr> <tr> <td>bbb</td> <td>bbb</td> <td>bbb</td></tr> <tr> <td>aaa</td> <td>aaa</td> <td>aaa</td></tr> <tr> <td>bbb</td> <td>bbb</td> <td>bbb</td></tr> </tbody> </table> </body> </html>
jquery交替变换颜色的三种方法 实例代码
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@