方便以后copy

时钟特效

  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  4. <title>时钟特效</title>
  5. <script type="text/javascript">
  6. function time(){
  7. var today = new Date(); //得到当前时间
  8. //获得年、月、日、小时、分钟、秒
  9. var yy = today.getFullYear();
  10. var MM = today.getMonth();
  11. var dd = today.getDay();
  12. var hh = today.getHours();
  13. var mm = today.getMinutes();
  14. var ss = today.getSeconds();
  15.  
  16. document.getElementById("time").innerHTML="<h1>"+yy+"年"+MM+"月"+dd+"日"+hh+":"+mm+":"+ss+"</h1>";
  17. //每秒钟回调一次
  18. setTimeout(time,1000);
  19. }
  20. </script>
  21. </head>
  22. <body onload="time()">
  23. <div id="time"></div>
  24. </body>
  25. </html>

JavaScript中提供了两个定时器函数:setTimeout()和setInterval()。

setTimeout()用于在指定的毫秒后调用函数或计算表达式。语法格式如下:

setTimeout(调用的函数名称,等待的毫秒数)    如:

  1. setTimeout(time,1000);

可以使用clearTimeout()清除定时器,如:

  1. var t = setTimeout(time,1000);
  2. clearTimeout(t);//清除定时器

setInterval()可按照指定的周期(以毫秒计)来调用函数或计算表达式。语法格式如下:

setInterval(调用的函数名称,周期性调用函数之间间隔的毫秒数)   如:

  1. setInterval(time,1000);

可以使用clearInterval()清除定时器,如:

  1. var t = setInterval(time,1000);
  2. clearInterval(t);//清除定时器

setTimeout()只执行一次,如果要多次调用函数,需要使用setInterval()或者让被调用的函数再次调用setTimeout()。

简单的javascript实例一(时钟特效)的更多相关文章

  1. 简单的javascript实例二(随页面滚动广告效果)

    方便以后copy 页面代码: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "htt ...

  2. 一个简单的JavaScript实例

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

  3. 纯js时钟特效详细代码分析实例教程

    电子时钟是网上常见的功能,在学习date对象和定时器功能时,来完成一个电子时钟的制作是不错的选择.学习本教程之前,读者需要具备html和css技能,同时需要有简单的javascript基础. 先准备一 ...

  4. 一些有用的javascript实例分析(三)

    原文:一些有用的javascript实例分析(三) 10 输入两个数字,比较大小 window.onload = function () { var aInput = document.getElem ...

  5. 一些有用的javascript实例分析(二)

    原文:一些有用的javascript实例分析(二) 5 求出数组中所有数字的和 window.onload = function () { var oBtn = document.getElement ...

  6. js 时钟特效

      时钟特效 CreateTime--2018年2月24日15:11:23 Author:Marydon 实现方式:都是基于HTML5的canvas标签实现的 款式一 借助jQuery插件实现 < ...

  7. javascript实例教程使用canvas技术模仿echarts柱状图

    canvas 画布是HTML5中新增的标签,可以通过js操作 canvas 绘图 API在网页中绘制图像. 百度开发了一个开源的可视化图表库ECharts,功能非常强大,可以实现折线图.柱状图.散点图 ...

  8. 最简单的JavaScript模板引擎

    在小公司待久了感觉自己的知识面很小,最近逛博客园和一些技术网站看大家在说JavaScript模版引擎的事儿,完全没有概念,网上一搜这是08年开始流行起来的...本来以为这是很高深的知识,后来在网上看到 ...

  9. JavaScript实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

随机推荐

  1. 从头开始——重装ubuntu

    一.装系统 环境:计算机原本装的系统是windows7+ubuntu 14.04,后来ubuntu的启动项被我手贱破坏了,进不了ubuntu,只能重新安装. 启动盘:使用UltraISO软碟通制作U ...

  2. 【枚举+数学】【HDU1271】整数对 难度:五颗星

    整数对 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total Submis ...

  3. 什么是目标、度量、KPI、维度和细分

    今天看到了Avinash的一篇文章:Web Analytics 101: Definitions: Goals, Metrics, KPIs, Dimensions, Targets,正是我想在影响网 ...

  4. android 5.0新特性CardView教程

    CardView 是android5.0新加入的特性,大家先别着急,由于谷歌出了cardview的兼容包,也就是android.support.v7.widget.CardView包,所以在5.0以下 ...

  5. 浅谈HTML5拖放

    现在,新增的HTML5元素很多,也给开发者带来了很多便利,比如说:结构标记header .nav.arctile.section.footer 表单元素:url.date.emaile.search. ...

  6. JSP进阶 之 SimpleTagSupport 开发自定义标签

    绝大部分 Java 领域的 MVC 框架,例如 Struts.Spring MVC.JSF 等,主要由两部分组成:控制器组件和视图组件.其中视图组件主要由大量功能丰富的标签库充当.对于大部分开发者而言 ...

  7. hasClass方法 动画方法说明

    $(this).hasClass("selected");判断是否含有selected样式

  8. groovy 弹出菜单

    import groovy.swing.* import javax.swing.* import java.awt.* def swing = new SwingBuilder() swing.fr ...

  9. Qt5-MSVC2012-qDebug中文乱码解决方法

    1.首先看代码: int main(int argc, char *argv[]) { QApplication a(argc, argv); MainWindow w; w.show(); qDeb ...

  10. [转]JSOM绘制地图区块及航道路径

    From :http://support.sailstech.com/kb/c73fd2405d79911253e568ccdc69256dc7c8fb5c/josm 步驟一: 使用JOSM繪製地圖區 ...