基于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操纵Cookie实现购物车程序
Nov 23 Javascript
很多人都是用下面的js刷新站IP和PV
Sep 05 Javascript
js运动框架_包括图片的淡入淡出效果
May 11 Javascript
jquery实现键盘左右翻页特效
Apr 30 Javascript
创建自己的jquery表格插件
Nov 25 Javascript
实践中学习AngularJS表单
Mar 21 Javascript
JavaScript与JQUERY获取元素的宽、高和位置
Feb 26 Javascript
Vue + Webpack + Vue-loader学习教程之功能介绍篇
Mar 14 Javascript
AngularJs 延时器、计时器实例代码
Sep 16 Javascript
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
vue 每次渲染完页面后div的滚动条保持在最底部的方法
Mar 17 Javascript
最全vue的vue-amap使用高德地图插件画多边形范围的示例代码
Jul 17 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
GD输出汉字的函数的分析
2006/10/09 PHP
apache mysql php 源码编译使用方法
2012/05/03 PHP
PHP易混淆知识整理笔记
2015/09/24 PHP
前端必学之PHP语法基础
2016/01/01 PHP
2020最新版 PhpStudy V8.1版本下载安装使用详解
2020/10/30 PHP
YUI的Tab切换实现代码
2010/04/11 Javascript
jQuery选中select控件 无法设置selected的解决方法
2010/09/01 Javascript
jquery 事件冒泡的介绍以及如何阻止事件冒泡
2012/12/25 Javascript
关于JS判断图片是否加载完成且获取图片宽度的方法
2013/04/09 Javascript
jquery动态添加删除div 具体实现
2013/07/20 Javascript
jquery操作复选框(checkbox)的12个小技巧总结
2014/02/04 Javascript
利用jquery.qrcode在页面上生成二维码且支持中文
2014/02/12 Javascript
JS常用函数使用指南
2014/11/23 Javascript
Javascript中的几种继承方式对比分析
2016/03/22 Javascript
JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题如何解决
2016/11/11 Javascript
移动端日期插件Mobiscroll.js使用详解
2016/12/19 Javascript
Vue+webpack+Element 兼容问题总结(小结)
2018/08/16 Javascript
Vue瀑布流插件的使用示例
2018/09/19 Javascript
javascript中call()、apply()的区别
2019/03/21 Javascript
Emberjs 通过 axios 下载文件的方法
2019/09/03 Javascript
[02:43]DOTA2英雄基础教程 德鲁伊
2014/01/13 DOTA
python 从远程服务器下载东西的代码
2013/02/10 Python
python数据挖掘需要学的内容
2019/06/23 Python
flask应用部署到服务器的方法
2019/07/12 Python
Django ORM多对多查询方法(自定义第三张表&amp;ManyToManyField)
2019/08/09 Python
pyhton中__pycache__文件夹的产生与作用详解
2019/11/24 Python
Python3 把一个列表按指定数目分成多个列表的方式
2019/12/25 Python
python3 xpath和requests应用详解
2020/03/06 Python
Python 将代码转换为可执行文件脱离python环境运行(步骤详解)
2021/01/25 Python
音乐教学随笔感言
2014/02/19 职场文书
主持词开场白
2014/03/17 职场文书
奥巴马胜选演讲稿
2014/05/15 职场文书
贷款委托书
2014/08/01 职场文书
2015年学生管理工作总结
2015/05/26 职场文书
MySQL学习之基础操作总结
2022/03/19 MySQL
Win11如何默认打开软件界面最大化?Win11默认打开软件界面最大化的方法
2022/07/15 数码科技