让JS帮你决定午餐吃什么吧

最愁就是每天中午吃什么了,有空就做了个 JavaScript 轮播随机选择。会轮播预先自定义的菜单中,然后点选定的时候确定一款。代码可以查看本页源代码获得,你可以自定义修改菜单数组。

效果演示

准备选午餐了。。

JavaScript Code

你可以自己修改定义午餐的数组,自己做一个选餐脚本吧!遂平县敖松广告

<script type="text/javascript">
//此处修改饭菜,以逗号隔开
var foodName = ‘拉面,食堂,外卖,肯德基,pizza hat,自带...‘;
var foodNameArray = foodName.split(‘,‘);
var num = foodNameArray.length-1;
var timer;
function $(o){
	return document.getElementById(o);
}
function change(){
	$(‘foodName‘).innerHTML = foodNameArray[getRun(0,num)];
}
function getRun(_min,_max){
	return parseInt(Math.random()*(_max-_min+1));
}
function Start(){
	clearInterval(timer);
	timer = setInterval(‘change()‘,30);
}
function Stop(){
	clearInterval(timer);
}
</script>
时间: 2024-09-28 20:32:04

让JS帮你决定午餐吃什么吧的相关文章

JS帮你计算属相

背景:一个人出生在2014年的正月初一,他的生肖到底是属蛇还是属马呢?这就要确定那一天才是一年的开始.是春节还是立春?每年的春节是正月初一,但是生肖必须是从立春日开始计算.春节是1912年孙中山先生废除旧历,采用公元纪年之后的1914年,时任民国大总统的袁世凯颁布法令,每年的正月初一是春节,在此之前传统上都是以二十四节气的立春作为岁首.综上所属,2014年正月初一出生的应该是属蛇. 既然知道了每年的立春日才是真正的生肖判断标准,那么怎么才能获取每年的立春日是多少呢? 网上有这么一个计算立春日的公

学会科学吃午餐 吃出健康也不难

一日的三餐都很重要,虽然我们常常提到早餐的重要性,其实午餐也是非常重要不可以忽视和怠慢的.当我们关注早餐营养和科学的时候,也一起来学学关于午餐科学饮食的问题吧.今天告诉大家午餐怎么吃,怎么吃才科学. 其实午餐还具有承上启下的作用,因为一般上午是一个人活动最为激烈的时候,对营养消耗也较大,所以午餐是及时给人体补充上午消耗能量的关键时刻,而午餐还应该为人体储存一定量的营养,以供下午活动消耗.那么如何选择午餐才更健康呢?下面小编就为大家介绍几点建议: 保证一定主食量 在午餐中一定要保证有一定比例的主食

一句JS帮你秒杀,抢购

刚刚看到一哥们儿写了一篇jquery插件之倒计时-团购秒杀  突然想到一个主意就是如题 想法:现在很多地方有类似秒杀,抢购等拼手速,网速的(其实就是服务器渣,如:某米),  很多人就想到可以写个客户端,开启一直刷, 我觉得应该可以直接通过js代码来执行. 下面进入正题 如果大家了解并会使用各浏览器的开发者工具就非常好办咯, 本人习惯用chrome,本例也就用chrome F12打开开发者工具 在控制台直接输入js带是可以执行的,所以大家应该有头绪了 测试: 写一个测试页面 <div> <

Html5之高级-7 HTML5 Chart.js(概述、入门、使用)

一.Chart.js 概述 Chart.js 简介 - Chart.js 是一个简单.面向对象.为设计者和开发者准备的图表绘制工具库 - 官方地址: http://www.chartjs.org/ Chart.js 特点 - 基于 HTML 5 - Chart.js 基于 HTML5 canvas技术,支持所有现代浏览器,并且针对IE7/8提供了降级替代方案 - 简单.灵活 - Chart.js 不依赖任何外部工具库,轻量级(压缩之后仅有4.5k),并且提供了加载外部参数的方法 Chart.js

用js实现轮播图

昨天一个朋友让我用js帮他做一个简单的轮播图,我本身就是菜鸟一个,js学得不怎么样,加上好久没敲代码,简直一头雾水,还好搞了将近一个小时终于搞定.今天有时间记录一下,分享给需要的朋友. 实现思路:轮播图其实就是一个定时器,所以我们只需要定时改变当前位置的图片即可.根据这一点实现起来就很简单了,下面直接上代码. 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o

nw.js桌面软件开发系列 第0.1节 HTML5和桌面软件开发的碰撞

第0.1节 HTML5和桌面软件开发的碰撞 当我们谈论桌面软件开发技术的时候,你会想到什么?如果不对技术本身进行更为深入的探讨,在我的世界里,有这么多技术概念可以被罗列出来(请原谅我本质上是一个Windows程序员的事实). 操作系统 API.操作系统发展到今日,几乎桌面应用的所有功能,都是基于系统API构建的.调用API和语言及技术无关,哪怕是使用汇编.例如(代码来源于网络,本地重新编译): ;我的第一个win32汇编程序 ;一个经典的hello world !程序 ;>>>>&

chart.js简单的图标绘制工具

   前 言 chart.js Chart.js帮你用不同的方式让你的数据变得可视化.每种类型的图表都有动画效果,并且看上去非常棒,即便是在retina屏幕上. Chart.js基于HTML5 canvas技术,支持所有现代浏览器,并且针对IE7/8提供了降级替代方案. Chart.js不依赖任何外部工具库,轻量级(压缩之后仅有4.5k),并且提供了加载外部参数的方法. 1导入Chart.js文件 <script src="Chart.js"></script>

图解 WebGL &amp; Three.js 工作原理

1.WebGL背后的工作原理是什么? 2.以Three.js为例,讲述框架在背后扮演什么样的角色? 我们为什么要了解原理? 我们假定你对WebGL已经有一定了解,或者用Three.js做过了一些东西,这个时候,你可能碰到了这样一些问题: 1.很多东西还是做不出来,甚至没有任何思路: 2.碰到bug无法解决,甚至没有方向: 3.性能出现问题,完全不知道如何去优化. 这个时候,我们需要了解更多. 1.什么是矩阵? 简单说来,矩阵用于坐标变换,如下图: 2.那它具体是怎么变换的呢,如下图: 3.举个实

angular js使用记录

jquery本身并不是框架,而仅仅是一个操作dom的工具,它的核心是操作dom; 目前较火的前端框架:backbone.angularjs.react.avalon.vue; angularjs是由google开发的框架并进行维护,特别针对SPA(单页面)应用开发的框架,但不支持按需加载; MV*; mvvm框架 达到视图与逻辑(模块)同时绑定,同时更新: 1.ng-app——指令,使文档具有angularjs的能力(视图与逻辑混合); angular的核心就是视图与逻辑的同时绑定.同时更新;