<!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的随机数
//定义一个数组 用来装蓝色球的随机数
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>

使用JavaScript实现简单的双色球的更多相关文章

  1. JavaScript设置简单的自动时间

    下面就是一段简单的JavaScript设置简单的自动时间,时间显示在一个输入框input里面. <html> <head> </head> <body> ...

  2. Javascript的简单测试环境

    在<JavaScript忍者秘籍>2.4测试条件基础知识中,作者给出了一个精简版的assert和assert组的实现,对于初学者而言,这无疑是一个很好的例子,既让我们得到了一个好用的小工具 ...

  3. javaScript(2)---简单使用

    javaScript(2)---简单使用 学习要点: 1.创建一张HTML页面 2.<Script>标签解析 3.JS代码嵌入的一些问题 一.创建一张HTML页面 <!DOCTYPE ...

  4. Javascript学习-简单测试环境

    Javascript学习-简单测试环境 在<JavaScript忍者秘籍>2.4测试条件基础知识中,作者给出了一个精简版的assert和assert组的实现,对于初学者而言,这无疑是一个很 ...

  5. JavaScript中简单排序总结

    JavaScript中简单排序总结 冒泡排序 经典排序算法, 双重for循环 在第二个for循环的时候, j < arr.len -1 -i , 这一步的优化很重要 function bullS ...

  6. JavaScript 实现简单的 弹出框关闭框

    JavaScript 实现简单的 弹出框关闭框 知识点: 1.javaScript 添加HTML标签 2.javaScript 添加HTML标签属性 3.javaScript 追加元素 代码献上: & ...

  7. 用javascript实现简单的用户登录验证

    用javascript实现简单的用户登录验证 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  8. JavaScript做简单的购物车效果(增、删、改、查、克隆)

    比如有时候遇到下面这种情况,点击加入购物车,然后在上方的购物车中动态的添加商品以及商品的信息,我们就可以通过JavaScript实现简单的这些操作. 首先我们需要在html文档中,通过css对页面的布 ...

  9. JavaScript 最简单的图片切换

    使用前在文件外部要有1.jpg 2.jpg 只是简单的模仿flash图片切换,可在此基础上引申出各种不同的效果. 思路: 建立一个数组存放图片的src,然后调用setInterval周期性的调用cha ...

随机推荐

  1. (转载)oracle的v$sqlarea表

    原文摘自:http: [V$SQLAREA]  本视图持续跟踪所有shared pool中的共享cursor,在shared pool中的每一条SQL语句都对应一列.本视图在分析SQL语句资源使用方面 ...

  2. Django学习(一)---基本配置及创建项目、应用

    安装:在Django官网下载最新版Django然后通过pip安装即可 一.创建项目 进入文件夹,打开cmd窗口,输入django-admin startproject myblog(项目名) 二.创建 ...

  3. 基于GTID的Mysql-Mha高可用方案探索

    声明: 本篇文章内容整理来源于互联网以及本人自己的梳理总结,目的是从零到一的搭建起来mysql mha高可用架构. 一.软件概述 MHA(Master High Availability)目前在MyS ...

  4. Oozie时出现Exception in thread "main" java.lang.UnsupportedClassVersionError: com/mysql/jdbc/Driver : Unsupported major.minor version 52.0?

    不多说,直接上干货! 问题详情 [hadoop@bigdatamaster oozie--cdh5.5.4]$ bin/ooziedb.sh create -sqlfile oozie.sql -ru ...

  5. AndroidDemo - FloatWindowDemo

    安卓悬浮窗Demo 在桌面上创建一个小的悬浮窗.点击小悬浮窗后会弹出一个大的窗口.大窗口上有2个按键,分别为返回与关闭.点击大窗口外的部分能返回小窗口. 小窗口可以自由拖动.小窗口上显示的是当前内存使 ...

  6. spring AOP原理

    spring 实现AOP是依赖JDK动态代理和CGLIB代理实现的.以下是JDK动态代理和CGLIB代理简单介绍    JDK动态代理:其代理对象必须是某个接口的实现,它是通过在运行期间创建一个接口的 ...

  7. YII2 添加全局自定义函数

    方法一: 这种方法就是直接在入口文件web/index.php里面写函数,示例代码如下: 全局函数 function pr($var){ //do something } (new yii\web\A ...

  8. 云计算——Google App Eng…

    云计算--Google App Engine(一) 编者:王尚 2014.04.12 20:20 介绍:Google App Engine提供一套开发组件让用户轻松的在本地构建和调试网络应用,之后能让 ...

  9. ASP.NET Core MVC – Caching Tag Helpers

    简介 缓存可以大大提高应用程序加载时间和响应速度.我们可以使用缓存Tag Helpers缓存不会频繁更改的HTML内容. 在上一篇文章中,我们谈到了Tag Helpers,演示Tag Helpers能 ...

  10. 记Angular与Django REST框架的一次合作(2):前端组件化——Angular

    注:这是这个系列的第二部分,主要集中在Angular的使用方面.之前使用过AngularJS(Angular 1.x),混在Django的模板中使用,这些页面一般完全是结果展示页.在有Django表单 ...