<!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. C++入门经典-例6.23-字符串数组赋值与string

    1:代码如下: // 6.23.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> #inc ...

  2. Leetcode题目34.在排序数组中查找元素的第一个和最后一个位置（中等）

    题目描述: 给定一个按照升序排列的整数数组 nums,和一个目标值 target.找出给定目标值在数组中的开始位置和结束位置. 你的算法时间复杂度必须是 O(log n) 级别. 如果数组中不存在目标 ...

  3. TCP时间戳选项Timestamp

    时间戳选项发送方在每个报文段中放置一个时间戳值.接收方在确认中返回这个数值,从而允许发送方为每一个收到的ACK计算RTT(我们必须说“每一个收到的ACK”而不是“每一个收到的报文段”,是因为TCP通常 ...

  4. 微信小程序设置全局变量

    为了提高程序的可用性我们在做项目的时候一定要设置全局变量 微信小程序里面有个app.js,我们可以在这个里面设置全局变量, globalData:{ userInfo:null, test:" ...

  5. mybatis延迟加载(Collection)

    上篇讲了assocation,同样我们也可以在一对多关系配置的结点中配置延迟加载策略. 结点中也有 select 属性,column 属性. 需求: 完成加载用户对象时,查询该用户所拥有的账户信息. ...

  6. vxWorks下常用的几种延时方法

         在应用编程的时候,通常会碰到需要一个任务在特定的延时之后执行一个指定的动作,如等待外设以确保数据可靠,控制扬声器发声时间以及串口通信超时重发等.这就需要利用定时器机制来计量特定长度的时间段. ...

  7. idea出现灰色或者黄色的波浪线如何去除

    1.File--setting--Editor-Inspections-Geneal-Duplicated Code 去除 主要是类中出现太多的重复代码,idea自动提示.

  8. OpenCV学习笔记(12)——OpenCV中的轮廓

    什么是轮廓 找轮廓.绘制轮廓等 1.什么是轮廓 轮廓可看做将连续的点(连着边界)连在一起的曲线,具有相同的颜色和灰度.轮廓在形态分析和物体的检测和识别中很有用. 为了更加准确,要使用二值化图像.在寻找 ...

  9. GitHub：Google

    ylbtech-GitHub:Google 1.返回顶部 · horenso 探しやすいコードで漢字直接入力    Perl  Apache-2.0 94710Updated on 19 Apr · ...

  10. props的写法

    简写 props: ['demo-first', 'demo-second'] 带类型 props: { 'demo-first': Number, 'demo-second': Number } 带 ...