代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>动态时钟</title>
</head>
<body><h1>你好,欢迎访问贵美商城!</h1><h2 id="time"></h2><script>//触发onload事件,定时器效果onload=function(){setInterval("getTime()",1000);}function getTime(){//实例化时间对象var date = new Date();//获取小时var hour = date.getHours();//获取分钟var minutes = date.getMinutes();//获取秒var seconds = date.getSeconds();//声明一个存储上下午的变量var amPm="";//将时间设成12小时制,并按照时间显示上午(AM)和下午(PM)if(hour>12){hour = hour-12;amPm="PM";}else{amPm="AM";}//判断如果分钟<10的是时候自动补0if(minutes<10){minutes="0"+minutes;}//判断如果秒数<10的时候自动补0if(seconds<10){seconds="0"+seconds;}//获取当前时间字符串var timeInfo = date.getFullYear()+"年"+ (date.getMonth()+1)+"月"+date.getDate()+"日"+"&nbsp&nbsp&nbsp"+hour+":"+minutes+":"+seconds;//星期中的某一天var week = date.getDay();//通过某一天来判断星期switch (week) {case 1:week="星期一";break;case 2:week="星期二";break;case 3:week="星期三";break;case 4:week="星期四";break;case 5:week="星期五";break;case 6:week="星期六";break;case 7:week="星期日";break;}//获取h标签var hNode=document.getElementById("time");//插入h标签hNode.innerHTML=timeInfo+"&nbsp&nbsp&nbsp"+amPm+"&nbsp&nbsp&nbsp"+week;}</script>
</body>
</html>

javascript之动态时钟相关推荐

web——javascript实现动态时钟
web--javascript实现动态时钟 javascript实现动态时钟,与当前时间同步. <!DOCTYPE html> <html lang="en"&g ...
JavaScript实现动态时钟显示
目录动态时钟显示效果代码实现 1.创建html文件(时钟显示.html) 2.设置html标签 3.设置html标签的CSS样式 4.设置JavaScript 1)创建函数和Date 2)获取da ...
JavaScript水滴动态时钟和倒计时时钟
4.3 date对象的常用属性和方法 Dpale 对象包含日期和时间的相关信息.Dule对象没有任何属性,它只具有很多用于现创建日期对象的语法如下: var now = new Date();//获 ...
javascript 计算器、动态时钟、表格复选框全选（扩展）、轮播图、36选7、随机数...
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
Html5代码实现动态时钟
以下是一个简单的HTML5动态时钟的示例: <!DOCTYPE html> <html> <head><title>HTML5动态时钟</titl ...
JavaScript制作的时钟
JavaScript制作的时钟分享一个自己制作的时钟.算是低级版的吧,秒钟分钟时钟都是可以获取到时间,根据时间来动的.是动态的. 效果图如下: 制作之前肯定要先把钟的各个部件画出来,然后加上样式,最 ...
Html5基于Canvas画一个动态时钟
文章目录前言一.前期准备二.绘制刻度 1.流程 2.效果图三.绘制文字 1.流程 2.效果图四.绘制指针 1.取得当前时间 2.绘制秒针 3.绘制分针 4.绘制时针 5.效果图五.绘制圆心 ...
数字时钟html脚本,javascript实现数字时钟效果
本文实例为大家分享了javascript实现数字时钟效果的具体代码,供大家参考,具体内容如下效果图需求分析 1.通过date获取时间 2.通过间隔定时器setInterval动态获取时间 3.间隔 ...
CSS+JS动态时钟（获取当前时间）
话不多说,先上代码 <!DOCTYPE html> <html><head><meta charset="utf-8"><ti ...

javascript之动态时钟

代码

javascript之动态时钟相关推荐

最新文章

热门文章