分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

JS — 实现简单的数字时钟

发布时间:2023-09-06 02:22责任编辑:彭小芳关键词:暂无标签

js实现简单的数字时钟

 1 <!DOCTYPE html> 2 <html> 3 <head> 4 ????<meta charset="UTF-8"> 5 ????<title>JS — 实现简单的数字时钟效果</title> 6 ????<link rel="stylesheet" type="text/css" href=""> 7 </head> 8 <body> 9 ????<div class="demo">10 ????????<span id="nowTime"></span>11 ????</div>12 </body>13 <script type="text/javascript">14 ????var newDate = ‘‘;15 ????getLangDate();16 ????function dateFilter(date){ //值小于10时,在前面补017 ????????if(date < 10){18 ????????????return "0"+date;19 ????????}20 ????????return date;21 ????}22 23 ????function getLangDate(){24 ????????var dateObj = new Date(); //表示当前系统时间的Date对象25 ????????var year = dateObj.getFullYear(); //当前系统时间的完整年份值26 ????????var month = dateObj.getMonth()+1; //当前系统时间的月份值27 ????????var date = dateObj.getDate(); //当前系统时间的月份中的日28 ????????var day = dateObj.getDay(); //当前系统时间中的星期值29 ????????var weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];30 ????????var week = weeks[day]; //根据星期值,从数组中获取对应的星期字符串31 ????????var hour = dateObj.getHours(); //当前系统时间的小时值32 ????????var minute = dateObj.getMinutes(); //当前系统时间的分钟值33 ????????var second = dateObj.getSeconds(); //当前系统时间的秒钟值34 ????????var timeValue = "" +((hour >= 12) ? (hour >= 18) ? "晚上" : "下午" : "上午" ); //当前时间属于上午、晚上还是下午35 ????????newDate = dateFilter(year)+"-"+dateFilter(month)+"-"+dateFilter(date)+" "+dateFilter(hour)+":"+dateFilter(minute)+":"+dateFilter(second);36 ????????document.getElementById("nowTime").innerHTML = "当前时间: "+newDate+" "+week;37 ????????setTimeout(getLangDate,1000);38 ????}39 </script>40 </html>

JS — 实现简单的数字时钟

原文地址:https://www.cnblogs.com/whx-blogs/p/9968263.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved