码迷,mamicode.com
首页 > 其他好文 > 详细

作品第一课----循环改变DIV颜色

时间:2015-12-23 22:39:42      阅读:165      评论:0      收藏:0      [点我收藏+]

标签:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
    button { margin: 0 auto; display: block; }
    ul { overflow: hidden; margin: 3% 0 0 32%; }
    li { width: 100px; height: 100px; margin-right: 50px; background-color: #000; list-style: none; float: left;}
    

    </style>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
    <button>点击循环改变颜色</button>
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <script type="text/javascript">
    $(document).ready(function(){
        $("button").on("click", function(){
            var num = $("li").length;
            for (var i = 0; i < num; i++) {
                $("li").eq(i).css("background-color", "red");
            };
        })
    })
    </script>
    
</body>
</html>

 

作品第一课----循环改变DIV颜色

标签:

原文地址:http://www.cnblogs.com/samtrybest/p/5071443.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!