用JavaScript中lodash编写双色球
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
header {
width: 500px;
height: 100px;
margin: 0 auto;
background-color: red;
border-radius: 10px;
} header>h1 {
color: orange;
text-align: center;
line-height: 100px;
} li {
list-style: none;
} input {
width: 40px;
height: 30px;
} .change {
width: 500px;
height: 400px;
background-color: burlywood;
margin: 0 auto;
} .change>p:first-child {
text-align: center;
font-size: 24px;
} .change>p:nth-child(2) {
color: red;
} .change>p:nth-child(4) {
color: blue;
} #red {
display: flex;
} #red input {
margin-right: 20px;
} #star {
width: 100px;
height: 50px;
margin-left: 190px;
} .return {
color: red;
font-size: 20px;
text-align: center;
}
</style>
</head> <body> <header>
<h1>中国福利双色球</h1>
</header> <div class="change">
<p>请选择号码</p>
<p>红球(1~33)</p>
<ul id="red">
<li id="red1">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
</li>
</ul>
<p>蓝球(1~16)</p>
<ul id="blue">
<li>
<input type="text" value="" id="playblue">
</li>
</ul>
<p>
<input type="button" value="确定" id="star">
</p>
<p>彩票结果为：</p>
<p class="return"></p>
</div> <script src="./lodash.js"></script>
<script>
window.onload = function () {
let num = [];//创建空数组
while (true) {
num.push(_.random(1, 33));//将随机数添加到num中
num = _.uniq(num)//去重
if (num.length == 6) {
break;
}
}
let num1 = [];//蓝球数
num1.push(_.random(1, 16));
console.log(num, num1)
let star = document.getElementById('star');
let playblue = document.getElementById('playblue');
let end =document.querySelector('.return');
let input = document.querySelectorAll('#red1>input')//得到所有的input
console.log(input)
star.onclick = function () {
//红球
let play = [];
_.forEach(input, function (text) {
let test = text.value-0;//获取输入的值
play.push(test)
})
//蓝球
let play1=[];
play1.push(playblue.value-0);
//判断
//红球判断
restu=_.intersection(num,play);
//蓝球判断
restu1=_.intersection(num1,play1);
if(restu.length==6&&restu1.length==0){
end.innerHTML="恭喜你获得二等奖"
}else if(restu.length==4||(restu.length==3&&restu1.length==1)){
end.innerHTML='恭喜你获得五等奖：10元'
}else if(restu.length==1&&restu1.length==1){
end.innerHTML='恭喜你获得六等奖：5元'
}else if(restu.length==0){
end.innerHTML='未中奖'
}else if(restu.length==6&&restu1.length==1){
end.innerHTML="恭喜你获得一等奖500万"
}else if(restu.length==5&&restu1.length==1){
end.innerHTML="恭喜你获得三等奖3000元"
}
} }
</script>
</body> </html>
用JavaScript中lodash编写双色球的更多相关文章
- 用JavaScript中jQuery编写放大镜效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [技术翻译]在现代JavaScript中编写异步任务
本周再来翻译一些技术文章,本次预计翻译三篇文章如下: 04.[译]使用Nuxt生成静态网站(Generate Static Websites with Nuxt) 05.[译]Web网页内容是如何影响 ...
- javascript中的this与函数讲解
前言 javascript中没有块级作用域(es6以前),javascript中作用域分为函数作用域和全局作用域.并且,大家可以认为全局作用域其实就是Window函数的函数作用域,我们编写的js代码, ...
- 【总结】浅谈JavaScript中的接口
一.什么是接口 接口是面向对象JavaScript程序员的工具箱中最有用的工具之一.在设计模式中提出的可重用的面向对象设计的原则之一就是“针对接口编程而不是实现编程”,即我们所说的面向接口编程,这个概 ...
- JavaScript中的this陷阱的最全收集
JavaScript来自一门健全的语言,所以你可能觉得JavaScript中的this和其他面向对象的语言如java的this一样,是指存储在实例属性中的值.事实并非如此,在JavaScript中,最 ...
- JavaScript中的匿名函数及函数的闭包
1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式 第一种: ...
- 【转】JavaScript中的原型和继承
请在此暂时忘记之前学到的面向对象的一切知识.这里只需要考虑赛车的情况.是的,就是赛车. 最近我正在观看 24 Hours of Le Mans ,这是法国流行的一项赛事.最快的车被称为 Le Mans ...
- 浅显易懂的理解JavaScript中的this关键字
在JavaScript中this变量是一个令人难以摸清的关键字,this可谓是非常强大,充分了解this的相关知识有助于我们在编写面向对象的JavaScript程序时能够游刃有余. 1. 一般用处 对 ...
- JavaScript中的this陷阱的最全收集 没有之一
当有人问起你JavaScript有什么特点的时候,你可能立马就想到了单线程.事件驱动.面向对象等一堆词语,但是如果真的让你解释一下这些概 念,可能真解释不清楚.有句话这么说:如果你不能向一个6岁小孩解 ...
随机推荐
- Luogu 4240：毒瘤之神的考验
传送门 Sol 分开考虑 \(\varphi(ij)\) 中 \(ij\) 的质因子 那么 \[\varphi(ij)=\frac{\varphi(i)\varphi(j)gcd(i,j)}{\var ...
- 安装 Zsh 及 Oh-my-zsh
详细介绍就略过吧,可以参考这篇文章:使用ZSH的九个理由 下面记录一下我在配置ZSH的过程中的要点: 1.基本上你能找到的配置教程都是基于oh-my-zsh的. 因为zsh配置过于复杂,所以有了oh- ...
- ubuntu下面解压tar.gz包报错：tar命令报错： gzip: stdin: not in gzip format tar: Child returned status 1 tar: Error
原因: 压缩包文件不完整(损坏或者其他原因) 比如今天下载的tomcat8,使用ubuntu的命令下载的 curl -O http://apache.mirrors.ionfish.org/tomca ...
- MyBatis学习笔记(一)
测试Demo的目录结构: com.luohao.config ->MyBatisCongfig.xml ->userMapper.xml com.luohao.Test ->Test ...
- 1 年经验 Java 求职面试题
从 17 年的大三暑假就在这家公司实习转正,在这家公司呆了快2年了,随着公司新一轮的融资,看起来公司离上市更近了一步,但期权池也进一步稀释,没有期权的我感觉回报更少了,另外在这家公司接触到的东西也有瓶 ...
- Python标准库：内置函数hasattr() getattr() setattr() 函数使用方法详解
hasattr(object, name) 本函数是用来判断对象object的属性(name表示)是否存在.如果属性(name表示)存在,则返回True,否则返回False.参数object是一个对象 ...
- 在 Azure 虚拟机中配置 Always On 可用性组（经典）
在开始之前,请先假设现在可以在 Azure Resource Manager 模型中完成此任务. 我们建议使用 Azure Resource Manager 模型来进行新的部署. 请参阅 Azure ...
- python 3 输入和输出
一.普遍的输入和输出 1.输入 在python3中,函数的输入格式为:input(),能够接受一个标准输入数据,返回string类型. input() 函数是从键盘作为字符串读取数据,不论是否使用引号 ...
- EF学习之CodeFirst（二）--数据迁移
使用CodeFirst时,如果Model发生改变的话,例如我们给User类里面新加个Sex属性,运行时会出现如下错误: 这时我们需要使用数据迁移来将model的改变同步更新到数据库中. 1.启用数据迁 ...
- gitlab自动备份恢复与卸载
一.gitlab数据备份gitlab-rake gitlab:backup:create命令会在/var/opt/gitlab/backups目录下创建一个名称类似为1393513186_gitlab ...