js经典案例时间秒表掷骰子_第1页
js经典案例时间秒表掷骰子_第2页
js经典案例时间秒表掷骰子_第3页
js经典案例时间秒表掷骰子_第4页
全文预览已结束

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、效果1、在页面上显示个动态的时间2017110514:08:302*117-11-2419:39:922、在页面上实现-个秒表00:00:00(分钟:秒钟:仃分秒),通过三个按钮(开始,停止、«a来控制开始言止|3、在页面上实现一个掷骰子的效果.通过点击骰子图片开始变化,并自动停止<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>JavascriptTask</title></head>

2、<body><h1>1、在页面上显示一个动态的时间2017-11-0514:08:30</h1><pid="time"></p><script>functiondate_format()vardate_obj=newDate();varyear=date_obj.getFullYear();varmonth=date_obj.getMonth();month+;if(month<10)month="0"+month;varday=date_obj.getDate();if(da

3、y<10)day="0"+day;varhours=date_obj.getHours();if(hours<10)hours="0"+hours;varminutes=date_obj.getMinutes();if(minutes<10)minutes="0"+minutes;)varseconds=date_obj.getSeconds();if(seconds<10)seconds="0"+seconds;)returnyear+"-"+month+"-

4、"+day+""+hours+":"+minutes+":"+seconds;)functionshow_time()document.getElementById("time").innerHTML=date_format();)setInterval("show_time()",1000);</script><h1>2、在页面上实现一个秒表00:00:00(分钟:秒钟:百分秒),通过三个按钮(开始、停止、重置)来控制</h1><pid=&q

5、uot;second_watch">00:00:00</p><p><inputid="time_start"type="button"value="开始"onclick="time_start()"/><inputtype="button"value="停止"onclick="time_stop()"/><inputtype="button"value="重

6、置"onclick="time_reset()"/></p><script>vari1=0;vari2=0;vars1=0;vars2=0;varms1=0varms2=0;vart;functiontime_start()document.getElementById("time_start").disabled="true"ms2+;if(ms2>9)ms2=0;ms1+;)if(ms1>9)ms1=0;s2+;)if(s2>9)s2=0;s1+;)if(s1>5)s

7、i=0;i2+;)if(i2>9)i2=0;i1+;)if(i1>5)/超出秒表计数范围clearTimeout(t);returnfalse;)document.getElementById("second_watch").innerHTML""+i1+i2+”:"+s1+s2+”:"+ms1+ms2+”"document.getElementById("second_watch").style.c010r=t=setTimeout("time_start()",10);

8、)functiontime_stop()clearTimeout(t);document.getElementById("second_watch").style.c010r=document.getElementById("time_start").disabled="")functiontime_reset()clearTimeout(t);11 =0;12 =0;51 =0;s2=0;ms1=0;ms2=0;document.getElementById("second_watch").innerHTML&q

9、uot;"+i1+i2+”:"+s1+s2+”:"+ms1+ms2+”"document.getElementById("second_watch").style.c010r=document.getElementById("time_start").disabled="")</script>"black""red""black"</h1><h1>3、在页面上实现一个掷骰子的效果,通过点击骰子图片开始

10、变化,并自动停止<imgid="dice"src="dice-img/dice-6.jpg"width="100"height="100"onclick="dice_start()"/><script>vardice_num=0;/骰子图片数字varchange_num=0;/变化次数vart_dice;/计时函数返回值varrandom_num=0;/随机变化次数vardice_status=0;/骰子是否在转动的状态0表示停止1表示转动functiondice_sta

11、rt()if(dice_status=0)dice_change();elsereturnfalse;functiondice_change()dice_status=1;dice_num+;change_num+;if(dice_num>6)dice_num=1;if(random_num=0)random_num=Math.round(Math.random()*20+20);console.log(random_num);if(change_num>random_num)clearTimeout(t_dice);change_num=0;random_num=0;dice_status=0;returnfalse;document.getE

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论