基于javascript实现动态时钟效果


Posted in Javascript onAugust 18, 2020

本文实例讲解了javascript动态时钟效果的实现方法,分享给大家供大家参考,具体内容如下

基于javascript实现动态时钟效果

实现代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>动态时钟</title>
<script type="text/javascript">
//在网页上输出:今天的日期、星期、现在的时间(动态时钟)
function start()
{
 var today=new Date();
 var year=today.getFullYear();
 var month=today.getMonth()+1;
 var day=today.getDate();
 var hours=today.getHours();
 var minutes=today.getMinutes();
 var seconds=today.getSeconds();
 //如果是单位数字,前面补0
 month=month<10? "0"+month :month;
 day=day<10? "0"+day :day;
 hours=hours<10? "0"+hours :hours;
 minutes=minutes<10? "0"+minutes :minutes;
 seconds=seconds<10? "0"+seconds :seconds;
 //时间信息连成字符串
 var str="今天是"+year+"年"+month+"月"+day+"日 "+hours+":"+minutes+":"+seconds;
 //获取id=result的内容
 var obj=document.getElementById("result");
 obj.innerHTML=str;
 //延时器
 window.setTimeout("start()",1000);
}
</script>
</head>
 
<body onload="start()">
<div id="result"></div>
</body>
</html>

更多JavaScript时钟特效点击查看:JavaScript时钟特效专题

希望本文所述对大家学习javascript程序设计有所帮助。

Javascript 相关文章推荐
juqery 学习之四 筛选过滤
Nov 30 Javascript
javascript实现textarea中tab键的缩排处理方法
Jun 26 Javascript
node.js下LDAP查询实例分享
Sep 30 Javascript
jQuery实现调整表格单列顺序完整实例
Jun 20 Javascript
js+html制作简单验证码
Feb 16 Javascript
Node.js实现文件上传的示例
Jun 28 Javascript
Scala解析Json字符串的实例详解
Oct 11 Javascript
vue router-link传参以及参数的使用实例
Nov 10 Javascript
详解Vue项目在其他电脑npm run dev运行报错的解决方法
Oct 29 Javascript
从0到1构建vueSSR项目之node以及vue-cli3的配置
Mar 07 Javascript
vue 动态组件用法示例小结
Mar 06 Javascript
vue cli 3.0通用打包配置代码,不分一二级目录
Sep 02 Javascript
jQuery使用zTree插件实现树形菜单和异步加载
Feb 25 #Javascript
灵活的理解JavaScript中的this指向
Feb 25 #Javascript
jQuery插件实现表格隔行变色及鼠标滑过高亮显示效果代码
Feb 25 #Javascript
jQuery插件实现文字无缝向上滚动效果代码
Feb 25 #Javascript
jQuery zTree加载树形菜单功能
Feb 25 #Javascript
JavaScript实现搜索框的自动完成功能(一)
Feb 25 #Javascript
jquery插件之文字间歇自动向上滚动效果代码
Feb 25 #Javascript
You might like
最令PHP初学者们头痛的十四个问题
2007/01/15 PHP
MySql 按时间段查询数据方法(实例说明)
2008/11/02 PHP
在Ubuntu 18.04上安装PHP 7.3 7.2和7.0的方法
2019/04/09 PHP
thinkphp5实现微信扫码支付
2019/12/23 PHP
javascript 当前日期加(天、周、月、年)
2009/08/09 Javascript
在Ajax中使用Flash实现跨域数据读取的实现方法
2010/12/02 Javascript
jQuery带箭头提示框tooltips插件集锦
2014/11/17 Javascript
JavaScript中boolean类型之三种情景实例代码
2016/11/21 Javascript
javascript基础知识之html5轮播图实例讲解(44)
2017/02/17 Javascript
js实现文字列表无缝滚动效果
2017/06/23 Javascript
浅谈Emergence.js 检测元素可见性的 js 插件
2017/11/18 Javascript
微信小程序如何获取用户手机号
2018/01/26 Javascript
Node.JS用纯JavaScript生成图片或滑块式验证码功能
2019/09/12 Javascript
Vue 3.0双向绑定原理的实现方法
2019/10/23 Javascript
jquery实现直播视频弹幕效果
2020/02/25 jQuery
快速解决element的autofocus失效问题
2020/09/08 Javascript
NestJs使用Mongoose对MongoDB操作的方法
2021/02/22 Javascript
python通过opencv实现批量剪切图片
2017/11/13 Python
使用python对文件中的数值进行累加的实例
2018/11/28 Python
Python实现堡垒机模式下远程命令执行操作示例
2019/05/09 Python
python 求一个列表中所有元素的乘积实例
2019/06/11 Python
python基于TCP实现的文件下载器功能案例
2019/12/10 Python
Pytorch 中retain_graph的用法详解
2020/01/07 Python
基于Python爬虫采集天气网实时信息
2020/06/05 Python
CentOS 7如何实现定时执行python脚本
2020/06/24 Python
Python编写memcached启动脚本代码实例
2020/08/14 Python
python实现KNN近邻算法
2020/12/30 Python
IE浏览器单独写CSS样式的几种方法
2014/10/14 HTML / CSS
在Java开发中如何选择使用哪种集合类
2016/08/09 面试题
中科方德软件测试面试题
2016/04/21 面试题
公务员总结性个人自我评价
2013/12/05 职场文书
五好关工委申报材料
2014/05/31 职场文书
党课培训心得体会
2014/09/02 职场文书
协商一致解除劳动合同协议书
2014/09/14 职场文书
医院员工辞职信范文
2015/05/12 职场文书
结婚仪式主持词
2015/06/29 职场文书