1、创建part1.html

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

 <title>Date对象的使用-时钟特效</title>

 <script type="text/javascript">

 window.onload=function(){

   //获取第一个input标签

    var inputone=document.getElementsByTagName("input")[0];

    //给input标签添加点击事件

    inputone.onclick=function(){

      setTimeout("timeFun()",2000);

    }

    //获取第2个input标签

    var inputtwo=document.getElementsByTagName("input")[1];

    //给input标签添加点击事件

   var timestr;

    inputtwo.onclick=function(){

      timestr=setInterval("timeFun()",1000);

    }

     //获取第2个input标签

    var inputthree=document.getElementsByTagName("input")[2];

    //给input标签添加点击事件

    inputthree.onclick=function(){

       clearInterval(timestr);

    }

 }

 function timeFun(){

    var date=new Date();

    var year=date.getFullYear(); //获取四位年份

    var month=date.getMonth()+1; //月份

    var day =date.getDate(); //一个月中某一天,范围1-31

    var week=date.getDay(); //星期

    var hour=date.getHours(); //小时数,24进制

    var minutes=date.getMinutes(); //分钟

    var second=date.getSeconds();  //秒

    var time=year+"年"

            +month+"月"

            +day+"日  星期"+week+"  "

            +hour+"时"+minutes+"分"+second+"秒";

         console.log(time);

    document.getElementsByTagName("div")[0].innerHTML=time;

 }

 </script>

 </head>

 <body>

 <input type="button" value="3秒后出现"/>

 <input type="button" value="动态时钟"/>

 <input type="button" value="停止时钟"/>

 <div id="time">

 </div>

 </body>

 </html>

date对象实现时钟特效

2、效果图

3、点击“三秒后出现”

4、点击动态时钟

5、点击停止时钟，时间将停止各秒刷新

3、Data对象的更多相关文章

  1. vue data对象添加新属性触发视图

    <template> <div class="wrap open"> <a>{{test01.name}}</a> <a> ...

  2. Web 前沿——HTML5 Form Data 对象的使用

    XMLHttpRequest Level 2 添加了一个新的接口——FormData.利用 FormData 对象,我们可以通过 JavaScript 用一些键值对来模拟一系列表单控件,我们还可以使用 ...

  3. Vue实例的的data对象

    介绍 Vue的实例的数据对象data 我们已经用了很多了,数据绑定离不开data里面的数据.也是Vue的核心属性. 它是Vue绑定数据到HTML标签的数据源泉,另外Vue框架会自动监视data里面的数 ...

  4. HTML5 Form Data 对象的使用

    HTML5 Form Data 对象的使用  MDN: https://developer.mozilla.org/zh-CN/docs/Web/Guide/Using_FormData_Object ...

  5. vue 深度响应初步了解（检测data对象数据变化）

    当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项,Vue 将遍历此对象所有的属性,并使用Object.defineProperty把这些属性全部转为 getter/se ...

  6. java 常用类库：格式化NumberFormat；SimpleDataFormat类(转换Data()对象)；DateTimeFormatter 转换LocalDateTime时间对象

    NumberFormat类 该类是一个做数字格式化的类,它是一个抽象类,无法实例化.它提供了parse()和format()方法,其中format用于将数值,格式转化成字符串,parse()用于把字符 ...

  7. vuejsLearn--- -- 怎么查看、修改、追加数据---->data对象

    实例观察的数据对象.可以用一个新的对象替换.实例代理了它的数据对象的属 我们现在对data2添加几项 使用数组push()追加 但是直接这样不能进行数组操作 var data2 = { city: ' ...

  8. Web 前沿——HTML5 Form Data 对象的使用（转）

    XMLHttpRequest Level 2 添加了一个新的接口——FormData.利用 FormData 对象,我们可以通过 JavaScript 用一些键值对来模拟一系列表单控件,我们还可以使用 ...

  9. Web 前沿——HTML5 Form Data 对象的使用

    原文地址:http://www.cnblogs.com/lhb25/p/html5-formdata-tutorials.html XMLHttpRequest Level 2 添加了一个新的接口-- ...

  10. 【转】Web 前沿——HTML5 Form Data 对象的使用

    XMLHttpRequest Level 2 添加了一个新的接口——FormData.利用 FormData 对象,我们可以通过 JavaScript 用一些键值对来模拟一系列表单控件,我们还可以使用 ...

随机推荐

  1. SELinux开启和关闭

    1.查看SELinux状态 /usr/sbin/sestatus -v 2.关闭SELinux (1)临时关闭(不用重启机器): setenforce 0 #设置SELinux成为permissive ...

  2. WebTours服务的启动

    简介: HP loadrunner自带的一个飞机系统订票网站. 启动服务的步骤: 1.启动StartServer.bat 所在的路径: (\HP LoadRunner 12.02 Community ...

  3. python3中str的函数

    # 转换# 'capitalize',# 'lower',# 'upper',# 'casefold',# 'swapcase', 大小写互换# 'title',# 'strip',# 'rstrip ...

  4. SAP HANA procudure 创建用户

    SAP HANA中的用户是没有功能进行直接的拷贝的,但是我们可以通过建立存储过程调用,通过sql语句的方式进行拷贝: 存储过程定义如下,各位可根据自己的需求进行修改: CREATE PROCEDURE ...

  5. Unity启动事件-监听:InitializeOnLoad

    [InitializeOnLoad] :在启动Unity的时候运行编辑器脚本  官方案例: using UnityEngine; using UnityEditor; [InitializeOnLoa ...

  6. CSU 1811 Tree Intersection

    莫队算法,$dfs$序. 题目要求计算将每一条边删除之后分成的两棵树的颜色的交集中元素个数. 例如删除$u->v$,我们只需知道以$v$为$root$的子树中有多少种不同的颜色(记为$qq$), ...

  7. [HMLY]3.如何使用Xcode Targets管理开发和生产版本？

    本文原地址:http://www.appcoda.com/using-xcode-targets/ 在开始此教程之前,我们假设你已经完成了应用程序的开发和测试,现在准备提交生产发布.问题是,某些web ...

  8. EasyUI Messager 消息框

    通过 $.messager.defaults 重写默认的 defaults. 消息框(messager)提供不同样式的消息框,包括警示(alert).确认(confirm).提示(prompt).进展 ...

  9. jquery轻松实现li标签上下滚动的原理

    在网站上我们常看到有滚动的文字或者图片,比如消息提醒,新闻列表,等等.那么这些效果是怎么形成的呢?经过查阅,找到一种十分方便的写法,经过改良,得出我自己的终极版滚动效果. 我先写个布局吧 <di ...

  10. NEUQ1055谭浩强C语言(第三版)习题6.11

    //迭代公式不是很理解,写出来算了.. #include <stdio.h> #include <math.h> int main() { double x0,x1; int ...