在网页上显示一个钟表

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. 记录21.08.04 — mybatis入门学习

    mybatis入门 mybatis简介 MyBatis 是一款优秀的持久层框架,它支持自定义 SQL.存储过程以及高级映射.MyBatis 免除了几乎所有的 JDBC 代码以及设置参数和获取结果集的工 ...

  2. appium自动化测试（3）-控件定位&中文输入

    参考-控件定位 http://www.2cto.com/kf/201410/340345.html appium接口 http://appium.io/slate/en/master/?python# ...

  3. Flutter开发进阶学习指南Flutter开发进阶学习指南

    Flutter 的起源 Flutter 的诞生其实比较有意思,Flutter 诞生于 Chrome 团队的一场内部实验, 谷歌的前端团队在把前端一些"乱七八糟"的规范去掉后,发现在 ...

  4. 花1个月时间准备 面试华为，薪资和定级都谈好了却被拒，HR竟说......

    说在前面,千万不要频繁跳槽. 本来华为很想去的,面试前花了一个月的时间准备,面试过程挺顺利的,也拒绝了其他的所有面试邀请,而我拒绝其他面试邀请的底气,则是之前面试过程中的良好表现,薪资和定级都谈好了. ...

  5. MeteoInfo-Java解析与绘图教程(一)

    MeteoInfo-Java解析与绘图教程(一) 已经进入开发行业很多年了,这两年一直从事气象开发行业,为此对气象绘图有了新的见解 像色斑图与卫星图一直都有python去绘制,在偶然的情况下,我接触到 ...

  6. 手把手和你一起实现一个Web框架实战——EzWeb框架(五)[Go语言笔记]Go项目实战

    手把手和你一起实现一个Web框架实战--EzWeb框架(五)[Go语言笔记]Go项目实战 代码仓库: github gitee 中文注释,非常详尽,可以配合食用 本篇代码,请选择demo5 中间件实现 ...

  7. LDAP未授权访问学习

    LDAP未授权访问学习 一.LDAP 介绍 LDAP的全称为Lightweight Directory Access Protocol(轻量级目录访问协议), 基于X.500标准, 支持 TCP/IP ...

  8. spring security 入门级全篇代码

    CustomAccessDecisionManager 类 ---------------------------------------------------------------------- ...

  9. Leaflet 中 删除 一组 标记（Marker）

    动态显示一个标签: L.marker([obj.Y,obj.X]).addTo(map).bindPopup(obj.name).openPopup(); let layers=[]; let myG ...

  10. C# wpf中DataGrid 支持汇总行

    最近有一个需求,需要汇总金额,份额等字段.我们使用的是原生的WPF控件,自己开发了一套Template.而没有使用比较成熟的第三方控件.所以这个功能得自己开发.并且要做成控件层次的功能. 当然也可以这 ...