核心提示:项目中有时需要对表格进行隔行换色达到更加直观的作用。下面是代码案例(由于只是涉及页面前端所以开发工具为HBulider):!DOCTYPE htmlhtmlheadmeta charset=UTF-8...
项目中有时需要对表格进行隔行换色达到更加直观的作用。下面是代码案例(由于只是涉及页面前端所以开发工具为HBulider):
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>隔行换色</title> <script> function init(){ var len=document.getElementById("TB1").tBodies[0].rows.length; // alert(len); for (var i=0;i<len;i++) { if (i%2==0) { document.getElementById("TB1").tBodies[0].rows[i].style.background="red"; } else{ document.getElementById("TB1").tBodies[0].rows[i].style.background="pink"; } } } </script> </head> <body onload="init()"> <table id="TB1" border="1" width="100px" height="60" align="center"> <thead> <tr> <th>ID</th> <th>姓名</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>庄</td> </tr> <tr> <td>2</td> <td>张</td> </tr> <tr> <td>3</td> <td>王</td> </tr> </tbody> </table> </body> </html>