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>
  • 相关阅读:
    windows命令提示符常用命令
    JAVA中定义不同进制整数
    进制转换
    win10配置jdk环境变量
    AI Gossip
    搜狗大数据总监、Polarr 联合创始人关于深度学习的分享交流 | 架构师小组交流会
    后端渲染实践——看掘金社区是如何实践的
    谢孟军:The State of Go | ECUG Con 精粹系列
    让你的 CDN 费用省 50% 以上!图片瘦身的正确姿势
    七牛云大数据平台建设实践
  • 原文地址:https://www.cnblogs.com/dxmfans/p/9434860.html
Copyright © 2011-2022 走看看