JavaScript实现简单的双色球(实例讲解)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>双色球</title>
    <link rel="stylesheet" type="text/css" href="css/twoToneClass.css">
</head>
    <script type="text/javascript">
        function getway(){
        //定义一个数组 用来装红色球的随机数
            var reds=[parseInt(Math.random()*33+1)];  //1-33的随机数

                //PS: 在Angularjs中的写法。 
                $scope.random=Math.floor(Math.random()*10+1);

            //定义一个数组 用来装蓝色球的随机数
            var blues=[parseInt(Math.random()*16+1)];  //1-16的随机数

            while(reds.length<6){   //双色球是6红1蓝,故长度小于6  说明会循环5次  因为前面reds已经有一次的默认值
                var r=parseInt(Math.random()*33+1);  //定义r  随机数的取值与reds一致  用于与reds作比较
                for (var i = 0; i < reds.length; i++) {
                    if (reds[i]==r) {       //若 reds中的随机值与r中的相等,则跳出,继续i++取值
                        break;                //若reds中的随机值与r中的不相等,则进入else if
                    } else if(i==reds.length-1){  //reds.length-1 --> 原先的reds.length为5,减1为4,而数组是从0 开始算,所以这里会循环5次,刚好与 reds.length<6 同步;且 i等于reds.length-1,是让随机数循环5次(另外就是让它找到定义中的最后一位数)
                        reds.push(r);               //将r中的值添加到reds中    push():向数组中添加元素
//值得注意是!r与reds作比较时,是以reds中现有的数作比较,因为 reds.push(r); 这句代码已经向reds中添加了数值,所以r不是以reds中自身产生的随机数作比较,而是原先r添加到reds中的值作比较
                    }
                }
            }
            //document.write(reds);
            //排序
            reds.sort(function compare(a,b) {
                return a-b;
            })
            //打印随机数
            for (var h = 0; h < reds.length; h++) {
                document.getElementById('tone'+h+'').innerHTML=reds[h];
            }
             document.getElementById('tone6').innerHTML=blues;
        }
        
    </script>
<body>
    <div id="tone0"></div>
    <div id="tone1"></div>
    <div id="tone2"></div>
    <div id="tone3"></div>
    <div id="tone4"></div>
    <div id="tone5"></div>
    <div id="tone6"></div>
    <button type="button" id="cilckMe" onclick="getway()">点我生成双色球</button>
</body>
</html>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,012评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,628评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,653评论 0 350
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,485评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,574评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,590评论 1 293
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,596评论 3 414
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,340评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,794评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,102评论 2 330
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,276评论 1 344
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,940评论 5 339
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,583评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,201评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,441评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,173评论 2 366
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,136评论 2 352

推荐阅读更多精彩内容

  • trello for javascript. 简单的trello实例,用来实现鼠标拖拽停放。 作者:justjavaz
    熊爸爸领猫馆阅读 314评论 0 0
  • 青春里再过几月你就毕业了,快要离开这座城市了,可以摆脱这里的记忆和人了。这样就能让自己停止思念,停止对这里一切的...
    六季阅读 504评论 0 3
  • 在中国传统里,紫色是尊贵的颜色。对于我来说,紫色是梦幻,是浪漫,是神秘。我就是一个紫色控,每每看到紫色的东西总是欣...
    周巧的文字时光阅读 439评论 0 1
  • 春雪在下, 落在了我的头上, 像家母的手在抚摸着, 温暖着援疆游子的心。 春雪在下, 落在了我的脸上, 像爱人的嘴...
    孝爱义恩阅读 448评论 1 3
  • 一个人路是那么艰难,那么的孤寂。可,那又如何呢?
    我们那可怜的爱情阅读 181评论 1 0