利用随机数改变盒子样色,相邻两个不同色

这是一个随机数应用的小例子,简单明了:

<body>
        <style>
            #wrapper{width:300px;margin:0 auto;}
            #wrapper li{height:50px;text-align: center;font-size:18px;line-height: 50px;list-style-type:none;}
        </style>
        <div id="wrapper">
            <ul>
                <li>1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
                <li>5</li>
            </ul>
        </div>
        <script>
            window.onload = function(){
                for (var i = 0; i < document.querySelectorAll("#wrapper ul li").length; i++) {//querySelector 和 querySelectorAll 方法是 W3C Selectors API 规范中定义的。他们的作用是根据 CSS 选择器规范,便捷定位文档中指定元素。
            document.querySelectorAll("#wrapper ul li")[i].colorfulBg();
          }

            }
            // JavaScript Document

            var colors=["#69D2E7","#A7DBD8","#E0E4CC","#F38630","#FA6900","#C02942","#53777A"];
                    var rd = parseInt(Math.random()*colors.length);
                    this.style.backgroundColor=colors[rd];
                    if(this.previousElementSibling){
                        changeColor(this)
                    }
            //这个只是让他好看一点而已,并没有什么卵用
            Element.prototype.colorfulBg=function(){
                function changeColor(e){
                    if (e.style.backgroundColor!=e.previousElementSibling.style.backgroundColor){
                        return; //判断此盒子与上一个盒子颜色是否相同
                    }else{
                        var rd = parseInt(Math.random()*colors.length);//random();0-1随机数
                        e.style.backgroundColor=colors[rd];
                        return changeColor(e);
                    }
                } 

            }
        </script>
    </body>
时间: 2024-08-29 06:02:14

利用随机数改变盒子样色,相邻两个不同色的相关文章

N个未排序的随机数,在线性时间内,求这N个数在数轴上相邻两个数的最大值

1 public class MaxSub 2 { 3 public static void main(String[] args) 4 { 5 int[] a ={5,7,3,1,6,2}; 6 System.out.println(maxSub(a)); 7 8 } 9 10 /** 11 * @用于找出N个随机数在数轴相邻位置的最大差值 12 */ 13 public static int maxSub(int[] a) 14 { 15 int min=a[0];//初始化数组的最小值mi

利用&quot;SQL&quot;语句自动生成序号的两种方式

1.首先,我们来介绍第一种方式: ◆查询的SQL语句如下: select row_number() over (order by name) as rowid, sysobjects.[name] from sysobjects ◆运行的结果: rowid   name 1           all_columns 2           all_objects 3           all_parameters 4           all_sql_modules 5          

为什么Fibonacci数列相邻两项之比会趋于0.618

转帖: http://www.matrix67.com/blog/archives/5221 你或许熟知一个非常经典的结论: Fibonacci 数列 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, … (头两项都是 1 ,此后每一项都是前两项之和)的相邻两项之比将会越来越接近黄金比例 0.618 ,不信请看: 1 / 1 = 1.0000000... 1 / 2 = 0.50000000... 2 / 3 = 0.66666667... 3 / 5 = 0.60000000

SQLServer 分组查询相邻两条记录的时间差

原文:SQLServer 分组查询相邻两条记录的时间差 首先,我们通过数据库中表的两条记录来引出问题,如下图 以上为一个记录操作记录的表数据.OrderID为自增长列,后面依次为操作类型,操作时间,操作人. 现在的问题是:要求筛选出数据库中从“接收”到“送出”的时间差超过2天的全部记录.即如上图两笔单据中,红色框既是要筛选出的,绿色框为正常过滤的. 为了定位相邻记录,方法为给查询语句的返回记录加个自动编号列放入临时表中,再对临时表进行操作. --1.首先查出表中符合條件的所有信息 select

利用cookie改变背景色

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head> <title></title> <scr

排序练习题(六):相邻两数最大差值

有一个整形数组A,请设计一个复杂度为O(n)的算法,算出排序后相邻两数的最大差值. 给定一个int数组A和A的大小n,请返回最大的差值.保证数组元素多于1个. 测试样例: [1,2,5,4,6],5 返回:2 public class Gap { public int maxGap(int[] A, int n) { // write code here if(null == A ||n<2) return 0; int min=Integer.MAX_VALUE; int max=Intege

求斐波那契数列的相邻两项的比值,精确到小数后三位。

未完成,只能假设知道是9和10代入. 代码如下: package zuoye; import java.math.BigDecimal; /* * 求斐波那契数列的相邻两项的比值,精确到小数后三位. * p1,p2,p3......pi,pj,...求pi/pj * 1 1 2 3 5 8 13 * 5/8,8/13,...收敛 */ public class Test { static double feibo(int x){ if(x==1||x==2) return 1; return f

算法--相邻两数最大差值

相邻两数最大差值 代码实现 1 package com.hzf.sort; 2 3 import org.junit.Test; 4 5 /** 6 * 有一个整形数组A,请设计一个复杂度为O(n)的算法,算出排序后相邻两数的最大差值. 7 * 8 * 给定一个int数组A和A的大小n,请返回最大的差值.保证数组元素多于1个. 9 * 10 * 测试样例: [1,2,5,4,6],5 11 * 返回:2 12 * 13 * @author hzf 14 * 15 */ 16 public cla

【VC编程技巧】窗体?3.4利用bitmap改变对话框的背景。

效果图: 代码: 1.在对话框初始化函数OnInitDialog中加载bitmap,然后创建新的画刷. // CBitmapDemoDlg メッセージ ハンドラー BOOL CBitmapDemoDlg::OnInitDialog() { CDialogEx::OnInitDialog(); // "バージョン情報..." メニューをシステム メニューに追加します. // IDM_ABOUTBOX は.システム コマンドの範囲内になければなりません. ASSERT((IDM_ABOUT