JavaScript实现动态数字时钟
作者：小脆筒style 发布时间：2024-04-10 11:01:09
标签：js,数字时钟
本文实例为大家分享了JavaScript实现动态数字时钟的具体代码，供大家参考，具体内容如下
实现效果
代码实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
* {
padding: 0;
margin: 0;
}
#box {
width: 1000px;
height: 300px;
background-image:url(1.jpg);
line-height: 300px;
text-align: center;
font-size: 50px;
font-weight: 500;
margin: 100px auto;
}
</style>
</head>
<body>
<div id="box"></div>
<script>
let box = document.getElementById('box')
//不足十位补零
let addZero = val => val < 10 ? '0' + val : val
//把阿拉伯数字的星期转化为中国汉字的星期 // 星期映射表
let trans = val => {
let obj = {
0: '日',
1: '一',
2: '二',
3: '三',
4: '四',
5: '五',
6: '六'
}
return obj[val]
}
setTime ()
//获取时间的方法
function setTime() {
let time = new Date();
let year = time.getFullYear(); // 获取年
let month = time.getMonth() + 1; // 获取月（是从0到11，所以我们要给他加1）
let date = time.getDate(); // 获取日
let day = time.getDay(); // 获取星期几(0是星期日)
let hour = time.getHours(); // 获取小时
let min = time.getMinutes(); // 获取分钟
let sec = time.getSeconds(); // 获取秒
let value = year + '年' + addZero(month) + '月' + addZero(date) + '日 星期' + trans(day) + ' '+addZero(hour) +
'时' + addZero(min) + '分' + addZero(sec) + '秒'
// 把所有的时间拼接到一起
box.innerText = value
// console.log(value)
// 把拼接好的时间插入到页面
}
// 让定时器每间隔一秒就执行一次setTime这个方法（这是实现时钟的核心）
setInterval(setTime, 1000)
</script>
</body>
</html>
素材
来源：https://blog.csdn.net/weixin_46672830/article/details/116095996
0
投稿猜你喜欢
- 动机： 查询功能是我们在网站上见过的最普遍也是最常用的一个功能模块了。以往的信息查询都是连接到数据库的，每一次点击都必须要后台数据库的支持。
- 代码如下:Dim strName, iLoop For Each strName
- 本文实例形式讲解了Python3的条件与循环控制语句及其用法，是学习Python所必须掌握的重要知识点，现共享给大家供大家参考。具体如下：一
- 本文实例为大家分享了python人脸识别程序，大家可进行测试#coding:utf-8 import cv2 import sys from
- 前言作为Web开发人员，在 Web浏览器中存储数据以改善用户体验和提升Web应用程序性能是非常常见的。在大多数情况下，可供我们使用就是Loc
本文实例为大家分享了python绘制高斯曲线的具体代码，供大家参考，具体内容如下源码：import numpy as npimport ma- 在HeadFirstPython网站中下载所有文件，解压后以chapter 3中的“sketch.txt”为例： 新建IDLE会话
- Python装饰器，分两部分，一是装饰器本身的定义，一是被装饰器对象的定义。一、函数式装饰器：装饰器本身是一个函数。1.装饰函数：被装饰对象
- 看代码吧~如果两个dataloader的长度不一样，那就加个：from itertools import cycle仅使用zip，迭代器将在
- Spyder简介Spyder (前身是 Pydee) 是一个强大的交互式 Python 语言开发环境，提供高级的代码编辑、交互测试、调试等特
- 我的朋友没在服务器上设置DSN，可他一样访问数据库，他是怎样做到的？ 其实，只要我们知道数据库文件名(比如Access、Parad
- 在写一些很小的机器学习项目的时候,我们往往希望training, testing和inference能共用一个入口main,但是不同的功能使
- 写入文件使用open()函数和write()函数但是有两种写法，分别是'a'和'w'。'a'
- 这篇文章主要介绍了python numpy数组中的复制知识解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,
- 有这样一个要求，它要创建一个SQL Server查询，其中包括基于事件时刻的累计值。典型的例子就是一个银行账户，因为你每一次都是在不同的时间
- 1.查询数据库当前进程的连接数： select count(*) from v$process; 2.查看数据库当前会话的连接数： elec
- 继上一篇计算checksum校验和，本章通过socket套接字，struct字节打包成二进制，select返回套接字的文件描述符的结合，实现
- 首先,这片文章纯粹是我的个人经验之谈,适用于我常见的环境及项目中。个人建议,数据库字符集尽量使用utf8(HTML页面对应的是utf-8),
- 因为要做移动梦网WAP的一些接口，所以要用到这种方式，接下来会有ASP.net版本的，这个是ASP版本的，利用了MSXML2.XMLHTTP
- 一、概述spark 有三大引擎，spark core、sparkSQL、sparkStreaming，spark core 的关键抽象是 S
