<!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颜色的更多相关文章

  1. checkbox复选框和div click事件重叠，点击div后复选框也被选中，同时改变div颜色，否则则不选中

     checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...

  2. 作品第一课----改变DIV样式属性

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 第一课 1) 控制div属性 总结

    点击按钮变换属性: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  4. 18.libgdx制作预览图,背景移动循环,改变地图颜色

    经过构思,游戏将分为两部分, 1,预览图,只负责展示世界形势 2,根据预览图生成的战役项 现在要记录的是我制作预览图的部分 1.预览图只有实际地图的1/4,首先生成地图(建议不要缩放以前地图,由于误差 ...

  5. 作品第二课----点击DIV显示其内容

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 作品第一课----获取批量checkbox选中的值

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 吴恩达《深度学习》-第五门课 序列模型(Sequence Models)-第一周 循环序列模型（Recurrent Neural Networks） -课程笔记

    第一周 循环序列模型(Recurrent Neural Networks) 1.1 为什么选择序列模型?(Why Sequence Models?) 1.2 数学符号(Notation) 这个输入数据 ...

  8. NeHe OpenGL教程 第一课：OpenGL窗口

    转自[翻译]NeHe OpenGL 教程 前言 声明,此 NeHe OpenGL教程系列文章由51博客yarin翻译(2010-08-19),本博客为转载并稍加整理与修改.对NeHe的OpenGL管线 ...

  9. 【JavaScript从入门到精通】第一课 初探JavaScript魅力-01

    第一课 初探JavaScript魅力-01 JavaScript是什么 如今我们打开一个大型的网站,都会有很多JS效果的功能和应用.对于学过CSS+HTML的同学,即使是像淘宝那样的网站,用一两天时间 ...

随机推荐

  1. Codevs 1066 引水入城 2010年NOIP全国联赛提高组

    1066 引水入城 2010年NOIP全国联赛提高组 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 钻石 Diamond 传送门 题目描述 Description 在一个遥远的国度 ...

  2. ubuntu 安装 桌面 awesome

    受了ubuntu 12.04自带的桌面,运行太卡了 http://www.linuxzen.com/awesometmuxgnomedoda-zao-gao-xiao-linuxzhuo-mian-h ...

  3. ubuntu 安装qq

    受不了webqq那个界面 ,各种不习惯 .今天在ubuntu 12.04LTS 版本中 ,终于装上了qq2012,下面介绍一下安装方法 1  安装 wine sudo  apt-get install ...

  4. Lambda Expression In Java

     题记在阅读JDK源码java.util.Collections的时候在UnmodifiableCollection类中看到了这么一段代码: public void forEach(Consumer& ...

  5. IE6 png 透明 (三种解决方法)

    FF和IE7已经直接支持透明的png图了,下面这个主要是解决IE6下透明PNG图片有灰底的 ====================================================== ...

  6. JavaScript经典面试题系列

    1.javascript的typeof返回哪些数据类型 Object number function boolean underfind 2.例举3种强制类型转换和2种隐式类型转换? 强制(parse ...

  7. 在Django中使用Mako模板

    用了一个月后,终于忍受不了Django的模板了.主要原因是模板内不能运行原生的python语句,所以用起来总感觉被人绑住手脚,遍历个字典都要搞半天. 所以决定用第三方的模板.查了一下,django用的 ...

  8. POJ 2406 Power Strings 1961的简化版，kmp的next数组的应用

    题目: http://poj.org/problem?id=2406 跟1961差不多,题解就不写了,一开始理解错题了,导致WA一次. #include <stdio.h> #includ ...

  9. silverlight5开发的翻牌游戏

    扑克牌用了一个自定义控件,代码如下 public class CardButton : Button { public int state;//是否翻转0是未翻转,1是已翻转 private stat ...

  10. SVN版本控制与Visual Studio 2012的完美结合

    今天电脑重装了,所以vs,sqlserver,svn都得重装,因为我的公司目前使用的版本控制工具是svn.vs和sqlserver的安装均正常没有出现问题,但是在装svn的时候出了一点小插曲!svn下 ...