基于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 相关文章推荐
JS代码优化技巧之通俗版(减少js体积)
Dec 23 Javascript
Jquery UI震动效果实现原理及步骤
Feb 04 Javascript
JS截取字符串常用方法详细整理
Oct 28 Javascript
ie下$.getJSON出现问题的解决方法
Feb 12 Javascript
JavaScript中Cookies的相关使用教程
Jun 04 Javascript
BootStrap的table表头固定tbody滚动的实例代码
Aug 24 Javascript
js Canvas绘制圆形时钟效果
Feb 17 Javascript
JavaScript 作用域scope简单汇总
Oct 23 Javascript
小程序实现长按保存图片的方法
Dec 31 Javascript
js找出5个数中最大的一个数和倒数第二大的数实现方法示例小结
Mar 04 Javascript
浅谈Vue3.0新版API之composition-api入坑指南
Apr 30 Javascript
vue路由实现登录拦截
Mar 24 Vue.js
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实现小型站点广告管理
2006/10/09 PHP
PHP zip扩展Linux下安装过程分享
2014/05/05 PHP
phpmailer简单发送邮件的方法(附phpmailer源码下载)
2016/06/13 PHP
Laravel的throttle中间件失效问题解决方法
2016/10/09 PHP
多广告投放代码 推荐
2006/11/13 Javascript
Javascript isArray 数组类型检测函数
2009/10/08 Javascript
artDialog 4.1.5 Dreamweaver代码提示/补全插件 附下载
2012/07/31 Javascript
jQuery实用基础超详细介绍
2013/04/11 Javascript
可自己添加html的伪弹出框实现代码
2013/09/08 Javascript
对js关键字命名的疑问介绍
2014/04/25 Javascript
node.js中的fs.chmodSync方法使用说明
2014/12/18 Javascript
jQuery+PHP实现动态数字展示特效
2015/03/14 Javascript
JQuery显示隐藏DIV的方法及代码实例
2015/04/16 Javascript
Backbone.js 0.9.2 源码注释中文翻译版
2015/06/25 Javascript
基于JS实现的笛卡尔乘积之商品发布
2016/05/13 Javascript
Jquery组件easyUi实现手风琴(折叠面板)示例
2016/08/23 Javascript
JavaScript实现图片轮播组件代码示例
2016/11/22 Javascript
JS判断Android、iOS或浏览器的多种方法(四种方法)
2017/06/29 Javascript
JavaScript实现图片拖曳效果
2017/09/08 Javascript
JS获取月的第几周和年的第几周实例代码
2018/12/05 Javascript
ant-design-vue中的select选择器,对输入值的进行筛选操作
2020/10/24 Javascript
Python利用字典将两个通讯录文本合并为一个文本实例
2018/01/16 Python
Python 时间戳之获取整点凌晨时间戳的操作方法
2020/01/28 Python
python通过对字典的排序,对json字段进行排序的实例
2020/02/27 Python
python爬虫爬取淘宝商品比价(附淘宝反爬虫机制解决小办法)
2020/12/03 Python
paramiko使用tail实时获取服务器的日志输出详解
2020/12/06 Python
python生成word合同的实例方法
2021/01/12 Python
CSS3移动端vw+rem不依赖JS实现响应式布局的方法
2019/01/23 HTML / CSS
美国花布包包品牌:Vera Bradley
2017/08/11 全球购物
求职信的要素有哪些呢
2013/12/26 职场文书
销售主管岗位职责
2014/02/08 职场文书
财产公证书样本
2014/04/04 职场文书
2014年国庆节广播稿
2014/09/19 职场文书
伊索寓言读书笔记
2015/06/30 职场文书
小学远程教育工作总结
2015/08/13 职场文书
python基于机器学习预测股票交易信号
2021/05/25 Python