zoukankan      html  css  js  c++  java
  • JS表格各行变色

    <head>
        <title></title>
        <script type="text/javascript">
            onload = function () {


                document.getElementById('btn').onclick = function () {
                    //这个是获取这个页面中所有的tr
                    // var trs= document.getElementsByTagName('tr');
                    //获取指定的表中的tr
                    var trs = document.getElementById('tb').getElementsByTagName('tr');
                    for (var i = 0; i < trs.length; i++) {
                        if (i % 2 == 0) {
                            trs[i].style.backgroundColor = '';//默认颜色
                        } else {
                            trs[i].style.backgroundColor = 'yellow';
                        }

                    }
                };
            };
        
        </script>
    </head>
    <body>
        <input type="button" name="name" value="表格隔行变色" id="btn" />
        <table border="1" id="tb">
            <tr>
                <td>周润发
                </td>
                 <td>刘德华
                </td>
                 <td>周星驰
                </td>
            </tr>
             <tr>
                <td>周润发
                </td>
                 <td>刘德华
                </td>
                 <td>周星驰
                </td>
            </tr>
             <tr>
                <td>周润发
                </td>
                 <td>刘德华
                </td>
                 <td>周星驰
                </td>
            </tr>
             <tr>
                <td>周润发
                </td>
                 <td>刘德华
                </td>
                 <td>周星驰
                </td>
            </tr>
             <tr>
                <td>周润发
                </td>
                 <td>刘德华
                </td>
                 <td>周星驰
                </td>
            </tr>
             <tr>
                <td>周润发
                </td>
                 <td>刘德华
                </td>
                 <td>周星驰
                </td>
            </tr>
        </table>
    </body>
  • 相关阅读:
    为什么你SQL Server的数据库文件的Date modified没有变化呢?
    SQL Server中SELECT会真的阻塞SELECT吗?
    ORACLE从共享池删除指定SQL的执行计划
    flink DataStream API使用及原理
    漫谈九品中正制和现阶段阶层分层
    flink dataset api使用及原理
    从flink-example分析flink组件(3)WordCount 流式实战及源码分析
    TODO supply a title
    avalon2学习教程01
    avalon1与avalon2的异同点
  • 原文地址:https://www.cnblogs.com/dxmfans/p/9434860.html
Copyright © 2011-2022 走看看