<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="timeshow" style="border: dashed 1px black; width: 20% ; height: 40px;">00时00分00秒</div>
<br />
<input type="button" onclick="startTime()" value="开始"/>
<input type="button" onclick="stopTime()" value="结束"/>
<input type="button" onclick="clearTime()" value="清零"/>
</body>
<script type="text/javascript">
var minute=0,hour=0,seconds=0;
var timeout;

function startTime(){
mark=0;
var date=new Date();
seconds++;
if(seconds>60){
seconds=0;
minute++;
if(minute>60){
minute=0;
hour++;
}
}
document.getElementById("timeshow").innerHTML=hour+"时"+minute+"分"+seconds+"秒";

timeout=setTimeout("startTime()",1000);

}

function stopTime(){
if(timeout!=""){
clearTimeout(timeout) ;
}

}
function clearTime (){
document.getElementById("timeshow").innerHTML="00时00分00秒";
clearTimeout(timeout) ;
}
</script>
</html>

js制作秒表的更多相关文章

  1. js制作带有遮罩弹出层实现登录小窗口

    要实现的效果如下 点击“登录”按钮后,弹出登录小窗口,并且有遮罩层(这个名词还是百度知道的,以前只知道效果,却不知道名字) 在没有点击“登录”按钮之前登录小窗口不显示,点击“登录”按钮后小窗口显示,并 ...

  2. 基于node.js制作爬虫教程

    前言:最近想学习node.js,突然在网上看到基于node的爬虫制作教程,所以简单学习了一下,把这篇文章分享给同样初学node.js的朋友. 目标:爬取 http://tweixin.yueyishu ...

  3. 用JS制作一个信息管理平台完整版

      前  言 JRedu 在之前的文章中,介绍了如何用JS制作一个实用的信息管理平台. 但是那样的平台功能过于简陋了,我们今天来继续完善一下. 首先我们回顾一下之前的内容.   1.JSON的基础知识 ...

  4. 利用css+原生js制作简易钟表

    利用css+原生js制作简单的钟表.效果如下所示 实现该效果,分三大块:html.javascript.css html部分html部分比较简单,定义一个clock的div,内部有原点.时分秒针.日期 ...

  5. JS制作图片切换

    <!DOCTYPE html> <html> <head> <title>纯JS制作简单的图片切换</title> <meta cha ...

  6. 使用Vue.js制作仿Metronic高级表格（一）静态设计

    Metronic高级表格是Metonic框架中自行实现的表格,其底层是Datatables.本教程将主要使用Vue实现交互部分,使用Bootstrap做样式库.jQuery做部分用户交互(弹窗). 使 ...

  7. 使用 原生js 制作插件 (javaScript音乐播放器)

    1.引用页面 index.html <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  8. D3.js 制作中国地图 .net 公共基础类

    D3.js 制作中国地图 from:  http://d3.decembercafe.org/pages/map/index.html GeoJSON is a format for encoding ...

  9. 用js制作一个计算器

    使用js制作计算器 <!doctype html> <html lang="en"> <head> <meta charset=" ...

随机推荐

  1. Alpha冲刺（2/6）

    队名:007 组长博客: https://www.cnblogs.com/Linrrui/p/11861798.html 作业博客: https://edu.cnblogs.com/campus/fz ...

  2. 【转】python 输入一个时间，获取这个时间的下一秒

    原文:https://blog.csdn.net/l_d_56/article/details/84832198 输入一个时间,获取这个时间的下一秒 PS:下面代码使用于 python 2.7 tim ...

  3. ASP.Net Core承载外部程序集

    故事背景   一般情况下ASP.Net Core项目配置可以直接在appsetting.json中添加,也可以在项目中添加新的配置文件.但如果想和其他项目一起实现配置文件通用呢?我们可以用绝对定位去访 ...

  4. SAS数据挖掘实战篇【五】

    SAS数据挖掘实战篇[五] SAS--预测模型 6.1 测模型介绍 预测型(Prediction)是指由历史的和当前的数据产生的并能推测未来数据趋势的知识.这类知识可以被认为是以时 间为关键属性的关联 ...

  5. MongoDB数据节点基础操作

    1.查看集群中各节点的状态: rs0:PRIMARY> rs.status() 2.查看集群中各节点配置情况: rs0:PRIMARY> rs.conf() 3.主节点降级为从节点: rs ...

  6. 能详细说一下action:=cafree这句吗?好多书都没说清楚!

    关闭一个窗口有几种方式:最小化这个窗口,隐藏这个窗口,释放这个窗口,这句话就是说但这个窗口关闭的时候释放这个窗口,它应该是在form的onclose事件里面的 就是form.onclose() beg ...

  7. 利用Apache POI操作Excel

    最近在做接口,有个功能是利用Excel导入汽车发动机所需零件信息到线上系统中.简单回顾一下之前学过的用java操作Excel. 1.maven配置Apache POI pom.xml中配置POIjar ...

  8. Linux ：linux磁盘分区（普通分区2T以内），安装免安装版mysql（tar.gz）

    1.磁盘分区: 1 以root身份登录 查看磁盘信息(自行选择需要使用的磁盘,此处只需要了解信息) fdisk –l 创建新硬盘 fdisk /dev/vdb (决定使用哪个磁盘) 输入n回车,再输入 ...

  9. php使用装饰模式无侵入式加缓存

    <?php namespace App\Services; use Illuminate\Support\Facades\Log; use Illuminate\Support\Facades\ ...

  10. 03-MySQL多表操作

    一.表之间的关系 1.如何找出两张表之间的关系 分析步骤: #.先站在左表的角度去找 是否左表的多条记录可以对应右表的一条记录,如果是,则证明左表的一个字段foreign key 右表一个字段(通常是 ...