俱乐部会员信息管理系统

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            .one{
                background-color: red;
            }
            .two{
                background-color: blue;
            }
            
        </style>
        <script type="text/javascript" src="../js/jquery-1.11.1.js">
            
        </script>
        <script type="text/javascript">
            /*
            window.onload = function(){
                var tabEle = document.getElementById("tab1");
                var count = tabEle.tBodies[0].rows;
                var tab = count.length;
                for (var i = 0; i < tab; i++) {
                    if(i % 2 == 0){
                        count[i].className = "one";
                    }
                    count[i].onmouseover = function(){
                        color = this.className;
                        this.className = "two";
                    }
                    count[i].onmouseout = function(){
                        this.className = color;
                    }
                }    
            }
            */
            $(function(){
                $("#d1 tr:even").addClass("one");
                $("#d2").css("background-color","red");
            })
        </script>
    </head>
    <body>
        <table border="1px" cellspacing="0" cellpadding="5px" id = "tab1">
            <thead id="d2">
                <tr>
                    <th colspan="6">俱乐部会员信息</th>
                </tr>
            </thead>
            <tbody id="d1">
                <tr>
                    <td>编号</td>
                    <td>姓名</td>
                    <td>性别</td>
                    <td>年龄</td>
                    <td>家庭住址</td>
                    <td>Email</td>
                </tr>
                <tr>
                    <td>1</td>
                    <td>张思德</td>
                    <td>男</td>
                    <td>36</td>
                    <td>海淀区西北旺大街16号</td>
                    <td>社会人@.com</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>张三</td>
                    <td>男</td>
                    <td>15</td>
                    <td>海淀区西北旺大街16号</td>
                    <td>合会@.com</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>张三</td>
                    <td>男</td>
                    <td>15</td>
                    <td>海淀区西北旺大街16号</td>
                    <td>合会@.com</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>张三</td>
                    <td>男</td>
                    <td>15</td>
                    <td>海淀区西北旺大街16号</td>
                    <td>合会@.com</td>
                </tr>
            </tbody>
        </table>
    </body>
</html>

展开阅读全文

没有更多推荐了,返回首页