基于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 相关文章推荐
javascript数组组合成字符串的脚本
Jan 06 Javascript
网页中返回顶部代码(多种方法)另附注释说明
Apr 24 Javascript
jquery图形密码实现方法
Mar 11 Javascript
jquery操作angularjs对象
Jun 26 Javascript
jQuery实现可兼容IE6的淡入淡出效果告警提示功能示例
Sep 20 jQuery
vue router嵌套路由在history模式下刷新无法渲染页面问题的解决方法
Jan 25 Javascript
微信小程序 如何引入外部字体库iconfont的图标
Jan 31 Javascript
详解关于JSON.parse()和JSON.stringify()的性能小测试
Mar 14 Javascript
ckeditor一键排版功能实现方法分析
Feb 06 Javascript
js实现QQ邮箱邮件拖拽删除功能
Aug 27 Javascript
vue 里面的 $forceUpdate() 强制实例重新渲染操作
Sep 21 Javascript
Vue中强制组件重新渲染的正确方法
Jan 03 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
2019十大人气国漫
2020/03/13 国漫
一些被忽视的PHP函数(简单整理)
2010/04/30 PHP
php类自动加载器实现方法
2015/07/28 PHP
在WordPress中实现评论头像的自定义默认和延迟加载
2015/11/24 PHP
php 字符串中是否包含指定字符串的多种方法
2018/04/12 PHP
页面版文本框智能提示JS代码
2009/11/20 Javascript
JQuery扩展插件Validate—6 radio、checkbox、select的验证
2011/09/05 Javascript
JS cookie中文乱码解决方法
2014/01/28 Javascript
window.onload追加函数使用示例
2014/03/03 Javascript
IE浏览器中图片onload事件无效的解决方法
2014/04/29 Javascript
关闭页面时window.location事件未执行的原因分析及解决方案
2014/09/01 Javascript
JSON格式的键盘编码对照表
2015/01/29 Javascript
Windows系统下安装Node.js的步骤图文详解
2016/11/15 Javascript
javascript事件的传播基础实例讲解(35)
2017/02/14 Javascript
详解关于Vue版本不匹配问题(Vue packages version mismatch)
2018/09/17 Javascript
JS判断用户用的哪个浏览器实例详解
2018/10/09 Javascript
小程序封装wx.request请求并创建接口管理文件的实现
2019/04/29 Javascript
vue实现给div绑定keyup的enter事件
2020/07/31 Javascript
Vue 实现监听窗口关闭事件,并在窗口关闭前发送请求
2020/09/01 Javascript
python中readline判断文件读取结束的方法
2014/11/08 Python
python使用Tkinter显示网络图片的方法
2015/04/24 Python
Phantomjs抓取渲染JS后的网页(Python代码)
2016/05/13 Python
Python2随机数列生成器简单实例
2017/09/04 Python
使用Python设计一个代码统计工具
2018/04/04 Python
Python中关于logging模块的学习笔记
2020/06/03 Python
Expedia马来西亚旅游网站:廉价酒店,度假村和航班预订
2016/07/26 全球购物
美国台面电器和厨具品牌:KitchenAid
2019/04/12 全球购物
Intersport西班牙:在线体育商店
2019/11/06 全球购物
Goodee官方商店:迷你投影仪
2021/03/15 全球购物
销售主管岗位职责范本
2014/02/14 职场文书
舞蹈专业求职信
2014/06/13 职场文书
2015大学自主招生自荐信范文
2015/03/04 职场文书
婚礼上证婚人致辞
2015/07/28 职场文书
少先队中队工作总结
2015/08/14 职场文书
党员电教片《信仰》心得体会
2016/01/15 职场文书
Maven学习----Maven安装与环境变量配置教程
2021/06/29 Java/Android