1. 程式人生 > >JavaScript for迴圈實現表格隔行變色

JavaScript for迴圈實現表格隔行變色

本程式碼主要演示的是for迴圈,

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript for迴圈實現表格隔行變色</title>
    <script>
        window.onload=function () {
            oTab = document.getElementById('tab1');

            for(var i=0;i<
oTab.tBodies[0].rows.length; i++){ if(i%2){ oTab.tBodies[0].rows[i].style.backgroundColor='green'; }else { oTab.tBodies[0].rows[i].style.backgroundColor='lightgreen' } } } </script> </
head> <body> <table id="tab1" width="500px" border="1px grap solid"> <thead> <tr> <td>ID</td> <td>NAME</td> <td>AGE</td> </tr> </thead> <tbody> <tr>
<td>01</td> <td>Apollo</td> <td>28</td> </tr> <tr> <td>02</td> <td>Ann</td> <td>25</td> </tr> <tr> <td>03</td> <td>Merry</td> <td>26</td> </tr> <tr> <td>04</td> <td>John</td> <td>26</td> </tr> <tr> <td>05</td> <td>Eva</td> <td>28</td> </tr> </tbody> </table> </body> </html>