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>
  • 相关阅读:
    假期总结三
    假期总结三
    假期总结三
    假期总结三
    Redis 在线管理工具(phpRedisAdmin)介绍 两次git
    Redis 在线管理工具(phpRedisAdmin)介绍 两次git
    Redis 在线管理工具(phpRedisAdmin)介绍 两次git
    Redis 在线管理工具(phpRedisAdmin)介绍 两次git
    进程
    C# exe文件 添加到windows 服务
  • 原文地址:https://www.cnblogs.com/dxmfans/p/9434860.html
Copyright © 2011-2022 走看看