隔行变色——js和jquery对比

来源:互联网 发布:tcga数据下载 编辑:程序博客网 时间:2024/06/06 00:41
 

Jquery方法

<head>
    <title></title>
    <script src="jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('.table1 tr:even').css("backgroundColor", "yellow");
        });
    </script>

</head>
<body>
    <table class="table1">
        <tr>
            <td>
                喜洋洋
            </td>
        </tr>
        <tr>
            <td>
                喜洋洋
            </td>
        </tr>
        <tr>
            <td>
                喜洋洋
            </td>
        </tr>
        <tr>
            <td>
                喜洋洋
            </td>
        </tr>
        <tr>
            <td>
                喜洋洋
            </td>
        </tr>
    </table>
</body>

 

Js操作

<script type="text/javascript">
        function ChangeColor() {
            var table = document.getElementById("table1");
            var trs = table.getElementsByTagName("tr");
            for (var i = 0; i < trs.length; i++) {
                if (i % 2 == 0) {
                    trs[i].style.backgroundColor = "yellow";
                }
            }
        }
    </script>

原创粉丝点击