在网页上显示一个钟表

html:

<body onload="startTime()">

    <div id="txt"></div>

</body>

js:

    function startTime(){

        var today = new Date();

        var h = today.getHours();

        var m = today.getMinutes();

        var s = today.getSeconds();

        m = checkTime(m);

        s = checkTime(s);

        document.getElementById("txt").innerHTML = h + ":"+ m + ":" + s;

        t = setTimeout('startTime()',500);

    }

    function checkTime(i){

        if (i<10){

            i="0" + i

        }

        return i

    }

js实现钟表的更多相关文章

  1. JS+CSS 钟表

    .<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title& ...

  2. JS时钟钟表

    <!DOCTYPE html> <html>    <head>        <meta charset="utf-8" />   ...

  3. js实现一个简单钟表动画(javascript+html5 canvas)

    第一次在博客园注册发博.有一次去人家单位开标,看到开标网站上有个钟表动画,一时兴起,就写了个简单的钟表动画. 用js和html5 canvas对象实现一个简单钟表程序 主要用到的就是h5的canvas ...

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

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

  5. 用css3+js写了一个钟表

    有一天看到css3旋转这个属性,突发奇想的写了一个钟表(没做浏览器兼容),来一起看看是怎么写的吧! 先给个成品图,最终结果是个样子的(动态的). 首先,思考了一下页面的布局,大致需要4层div,最底层 ...

  6. js 构造函数创建钟表

    翻出来之前的一些效果,觉得这个时钟还挺好玩的就写出来共大家分享: HTML代码如下: <div id="box"> </div> 当前盒子用于插入钟表内容: ...

  7. js css3实现钟表效果

    原理: 利用transform-origin改变旋转的圆心,实现秒数和分钟数的刻度线,利用transfrom translate实现钟表小时刻度的显示 html: <div class=&quo ...

  8. 简单的JS钟表计时

    思路:先写出简单的数字计时,根据时分秒的数值转换成度数,使用CSS3的transform进行div倾斜. 知识点:transform可以对div进行倾斜或旋转等效果.但是根据浏览器不同代码也不同,本代 ...

  9. css3++js钟表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. tensorflow踩坑合集2. TF Serving & gRPC 踩坑

    这一章我们借着之前的NER的模型聊聊tensorflow serving,以及gRPC调用要注意的点.以下代码为了方便理解做了简化,完整代码详见Github-ChineseNER ,里面提供了训练好的 ...

  2. 04.委托Delegation

    1. 基本了解 1.1 委托简述 官方文档 委托是一种引用类型,表示对具有特定参数列表和返回类型的方法的引用,用于将方法作为参数传递给其他方法,可将任何可访问类或结构中与委托类型匹配的任何方法分配给委 ...

  3. netty系列之:基于流的数据传输

    目录 简介 package和byte 手动组合 Byte的转换类 ReplayingDecoder 总结 简介 我们知道由两种数据的传输方式,分别是字符流和字节流,字符流的意思是传输的对象就是字符串, ...

  4. 大厂需要什么样的 Android 开发？

    前言 昨天和一个百度的朋友闲聊,他说根据最近招聘 Android工程师的经验来看,大部分候选人在工作 3 年的时候基本都会遇上一道难过的坎. 为啥这么说呢? 因为工作一段时间之后,大部分工程师都已经完 ...

  5. Python开发篇——基于React-Dropzone开发上传组件

    这次我要讲述的是在React-Flask框架上开发上传组件的技巧.我目前主要以React开发前端,在这个过程中认识到了许多有趣的前端UI框架--React-Bootstrap.Ant Design.M ...

  6. Mantis安装过程笔记

    安装平台:Windows Server 2003 R2 Enterprise x64 Edition 软件: EasyPHP-5.3.6.1 mantisbt-1.2.6 安装过程: 首先安装Easy ...

  7. Vue CLI安装报错 npm ERR! Exit handler never called!

    安装Vue CLI时报错: npm install –g vue-cli 试了四种办法 1.把全局安装-g放到后面 npm install @vue/cli –g 2.命令行输入 npm 缓存清理命令 ...

  8. JSTL标签工具类

    一.介绍: ​ 1.Jsp Standrad Tag Lib: JSP中标准的标签工具类 ​ 2.由 sun公司 提供 ​ 3.组成:(1)核心标签:Java在jsp上基本功能进行封装 if whil ...

  9. JVM学习笔记之class文件结构【七】

    一.概念 1.1 无符号数: 以 u1.u2.u3.u4.u8 代表 1 个字节,2 个字节.4 个字节.8 个字节的无符号数.无符号数可以描述数字,索引引用.数量值和按照 UTF-8 编码构成的字符 ...

  10. Intellj IDEA 光标显示insert状态解决办法

    使用idea过程中,不知道怎么回事,鼠标的光标老是insert状态,体验效果极其差劲,于是去百度,扒拉了好一阵,过滤了垃圾博客,发现了有两种方法可以解决此问题: 第一种方法: 在File------& ...