当前位置: 首页 > news >正文

做一个简单的倒计时

 <div>距离过年还有:<span></span></div><script>let div = document.querySelector("div");let span = document.querySelector("span");// 获取未来时间戳let future = +new Date("2024-2-10 00:00:00");// 获取当下时间的时间戳 => 实际开发中 当下时间一般从后台服务器获取let now = +new Date();//   获取两个时间的时间差let dTime = Math.floor((future - now) / 1000);console.log(dTime);//   开启定时器 一秒钟执行一次let id = setInterval(function () {// 将对应的秒数每一秒自行减一dTime--;// 当倒计时结束时 进行一个收尾工作 使用判断条件if (dTime <= 0) {// 清除定时器clearInterval(id);return;}// 将对应的秒数转换成易于阅读的时分秒// 1小时 = 3600秒let a = Math.floor(dTime / 3600);// 一分钟 = 60秒// 取模=取余数 / 60let b = Math.floor((dTime % 3600) / 60);// 直接取余60let c = dTime % 60;span.innerText = `${a}小时${b}分钟${c}秒`;// let m = span;// btn.onclick = function () {//   alert("m");// };}, 1000);

 

因为倒计时一般是24小时开始 所以没有做年月日 需要的可以自行添加

相关文章:

做一个简单的倒计时

<div>距离过年还有:<span></span></div><script>let div document.querySelector("div");let span document.querySelector("span");// 获取未来时间戳let future new Date("2024-2-10 00:00:00");// 获取当下…...

微服务环境搭建:docker+nacos单机

nacos需要连接mysql&#xff0c;持久化相关配置。 1. 部署好mysql后&#xff0c;新建nacos数据库然后初始化nacos脚本 -- -------------------------------------------------------- -- 主机: 192.168.150.101 -- 服务器版本: …...

Opencv轮廓检测运用与理解

目录 引入 基本理解 加深理解 ①比如我们可以获取我们的第一个轮廓,只展示第一个轮廓 ②我们还可以用一个矩形把我们的轮廓给框出来 ③计算轮廓的周长和面积 引入 顾名思义,就是把我们图片的轮廓全部都描边出来 也就是我们在日常生活中面部识别的时候会有一个框,那玩意就…...

Java 8的新特性简单分享(后续有系列篇~敬请期待)

Java 8的新特性分享 Java 8是Java语言迎来的一次革命性的更新&#xff0c;引入了众多强大的新特性&#xff0c;使得Java开发变得更加现代化和便捷。在这篇博客中&#xff0c;我们将深入探讨Java 8的一些主要特性&#xff0c;并通过丰富的案例演示展示它们的用法。 1. Lambda表…...

计算机网络-计算机网络的概念 功能 发展阶段 组成 分类

文章目录 计算机网络的概念 功能 发展阶段总览计算机网络的概念计算机网络的功能计算机网络的发展计算机网络的发展-第一阶段计算机网络的发展-第二阶段-第三阶段计算机网络的发展-第三阶段-多层次ISP结构 小结 计算机网络的组成与分类计算机网络的组成计算机网络的分类小结 计…...

246.【2023年华为OD机试真题(C卷)】分月饼(动态规划-JavaPythonC++JS实现)

🚀点击这里可直接跳转到本专栏,可查阅顶置最新的华为OD机试宝典~ 本专栏所有题目均包含优质解题思路,高质量解题代码(Java&Python&C++&JS分别实现),详细代码讲解,助你深入学习,深度掌握! 文章目录 一. 题目-分月饼二.解题思路三.题解代码Python题解代码J…...

java大数据hadoop2.9.2 Linux安装mariadb和hive

一、安装mariadb 版本centos7 1、检查Linux服务器是否已安装mariadb yum list installed mariadb* 2、如果安装了&#xff0c;想要卸载 yum remove mariadb rm -rf /etc/my.cnf rm -rf /var/lib/mysql 才能完全删除 3、安装mariadb 在线网络安装 yum install -y mari…...

Docker部署微服务问题及解决

&#x1f468;‍&#x1f393;作者简介&#xff1a;一位大四、研0学生&#xff0c;正在努力准备大四暑假的实习 &#x1f30c;上期文章&#xff1a;Docker容器命令案例&#xff1a;Nginx容器修改&#xff0c;Redis容器持久化 &#x1f4da;订阅专栏&#xff1a;Docker 希望文章…...

Android: alarm定时很短时,比如500ms,测试执行mPowerManager.forceSuspend()后,系统不会suspend

参考文档&#xff1a; https://blog.csdn.net/weixin_35691921/article/details/124961404 Android: alarm定时很短时&#xff0c;比如500ms&#xff0c;然后执行mPowerManager.forceSuspend()后&#xff0c;系统不会suspend&#xff0c;原因分析&#xff1a; static int ala…...

一个简单好用的C语言单元测试框架-Unity

Unity简介&#xff1a; Unity是一个用于C语言的轻量级单元测试框架。它由Throw The Switch团队开发&#xff0c;旨在简化嵌入式系统的单元测试。单元测试中单元的含义&#xff0c;单元就是人为规定的最小的被测功能模块&#xff0c;如C语言中单元指一个函数&#xff0c;Java里…...

ubuntu系统 vscode 配置c/c++调试环境

文章目录 1.安装插件2.目录结构3.cmake tools配置 1.安装插件 c/c插件 cmake cmake tools插件 2.目录结构 . ├── build ├── CMakeLists.txt ├── demo │ └── main.cpp ├── image.png ├── src │ ├── add.cpp │ └── add.hpp └── vsdebug.…...

算法练习-A+B/财务管理/实现四舍五入/牛牛的菱形字符(题目链接+题解打卡)

难度参考 难度&#xff1a;简单 分类&#xff1a;熟悉OJ与IDE的操作 难度与分类由我所参与的培训课程提供&#xff0c;但需要注意的是&#xff0c;难度与分类仅供参考。以下内容均为个人笔记&#xff0c;旨在督促自己认真学习。 题目 A B1. A B - AcWing题库财务管理1004:财…...

XSS语句

XSS测试语句 在测试网站是否存在XSS漏洞时&#xff0c;应该输入一些标签如<,>输入后查看网页源代码是否过滤标签&#xff0c;如果没过滤&#xff0c;很大可能存在XSS漏洞。 <h5>1</h5> <span>1</span> <SCRIPT>alert(document.cookie)&l…...

AD导出BOM表 导出PDF

1.Simple BOM: 这种模式下&#xff0c;最好在pcb界面&#xff0c;这样的导出的文件名字是工程名字&#xff0c;要是在原理图界面导出&#xff0c;会以原理图的名字命名表格。 直接在菜单栏 报告->Simple BOM 即可导出物料清单&#xff0c;默认导出 comment pattern qu…...

linux 的nobody是什么用户? 对安全有没有影响?

目 录 一、前言&#xff1a;nobody是不是可疑用户&#xff1f; 二、Linux系统中的nobody用户&#xff1f; 二、有nobody用户存在&#xff0c;安全吗&#xff1f; 一、前言&#xff1a;nobody是不是可疑用户&#xff1f; 在前面一篇文章“Linux安全问题,如何查看哪…...

2024年华数杯国际数学建模B 光伏电(Problem B: Photovoltaic Power)完整思路以及源代码分享

背景 中国的电力构成包括传统的能源发电&#xff08;如煤炭、石油和天然气&#xff09;、可再生能源发电 &#xff08;如水力发电、风能、太阳能和核能&#xff09;和其他形式的电力。这些发电方式在满足中 国巨大的电力需求方面发挥着至关重要的作用。根据最新数据&#xf…...

在 Spring MVC 中,用于接收前端传递的参数的注解有以下几种

目录 RequestParam&#xff1a; PathVariable&#xff1a; RequestBody&#xff1a; RequestHeader&#xff1a; CookieValue&#xff1a; RequestParam&#xff1a; 用于获取请求参数的值。可以指定参数名称和默认值。示例代码&#xff1a; GetMapping("/users&q…...

K8s常用命令

查看集群各节点的状态 部署应用 删除一个service服务 查询service服务列表 kubectl get services 查看网络资源 kubectl get svc pod 创建一个namespace kubectl create namaspace namespace名称 创建一个pod 通常不需要创建pod 查看pod kubectl get pods kube…...

MySQL的基本操作

目录 序言 一、SQL语句&#xff08;Structured Query Language&#xff09; 1.1 SQL简介 1.2 SQL语句的分类 1.3 SQL语句的书写规范 二、数据库操作 2.1 查看库 2.2 创建库 2.3 切换库 2.4 删除库 三、MySQL字符集 3.1 MySQL字符集的分类 3.2 UTF8和UTF8MB4的区别…...

【b站咸虾米】chapter4_vue组件_新课uniapp零基础入门到项目打包(微信小程序/H5/vue/安卓apk)全掌握

课程地址&#xff1a;【新课uniapp零基础入门到项目打包&#xff08;微信小程序/H5/vue/安卓apk&#xff09;全掌握】 https://www.bilibili.com/video/BV1mT411K7nW/?p12&share_sourcecopy_web&vd_sourceb1cb921b73fe3808550eaf2224d1c155 四、vue组件 uni-app官网 …...

Java网络编程——UDP通信原理

一、TCP和UDP概述 传输层通常以TCP和UDP协议来控制端点与端点的通信 TCPUDP协议名称传输控制协议用户数据包协议是否连接面向连接的协议。数据必须要建立连接无连接的协议&#xff0c;每个数据报中都给出完整的地址信息&#xff0c;因此不需要事先建立发送方和接受方的连接是…...

Spring | Srping AOP (AOP简介、动态代理、基于“代理类”的AOP实现)

目录: 1.Spring AOP简介1.1 AOP简介1.2 AOP术语 2.动态代理2.1 JDK动态代理2.2 CGLIB代理 3.基于“代理类”的AOP实现3.1 Spring的通知类型3.2 ProxyFactoryBean ( 可通知.xml配置文件完成aop功能 ) 1.Spring AOP简介 1.1 AOP简介 Spring的AOP模块&#xff0c;是Spring框架体系…...

StarRocks 生成列:百倍提速半结构化数据分析

半结构化分析主要是指对 MAP&#xff0c;STRUCT&#xff0c;JSON&#xff0c;ARRAY 等复杂数据类型的查询分析。这些数据类型表达能力强&#xff0c;因此被广泛应用到 OLAP 分析的各种场景中&#xff0c;但由于其实现的复杂性&#xff0c;对这些复杂类型分析将会比一般简单类型…...

数据结构---数组

一、基本概念 1. 存放一组相同数据类型的集合 2.在内存中,分配连续的空间,数组创建时要指定大小 3. 定义 数据类型 [] 数组名 // 1.定义一个数组,里面的元素包含10, 20, 24, 17, 35, 58, 45, 74 int arr[] {10, 20, 24, 17, 35, 58, 45, 74}; 4. 获取数组的长度 int lengt…...

知识笔记(八十四)———链式语句中fetchSql和force和bind用法

fetchSql&#xff1a; fetchSql用于直接返回SQL而不是执行查询&#xff0c;适用于任何的CURD操作方法。 例如&#xff1a; $result Db::table(think_user)->fetchSql(true)->find(1);输出result结果为&#xff1a; SELECT * FROM think_user where id 1 force&#…...

为什么要用B+树

B树的优势 支持范围查询&#xff1a;B树在进行范围查询时&#xff0c;只需要从根节点一直遍历到叶子节点&#xff0c;因为数据都存储在叶子节点上&#xff0c;而且叶子节点之间有指针连接&#xff0c;可以很方便的进行范围查询 支持排序&#xff1a;B树的叶子节点按照关键字顺…...

Android 通过adb命令查看应用流量

一. 获取应用pid号 通过adb shell ps -A | grep 包名 来获取app的 pid号 二. 查看应用流量情况 使用adb shell cat /proc/#pid#/net/dev 命令 来获取流量数据 备注&#xff1a; Recevice: 表示收包 Transmit: 表示发包 bytes: 表示收发的字节数 packets: 表示收发正确的…...

超全的测试类型详解,再也不怕面试答不出来了!

在软件测试工作过程中或者在面试过程中经常会被问到一些看起来简单但是总是有些回答不上的问题&#xff0c;比如你说说“黑盒测试和白盒测试的区别&#xff1f;”&#xff0c;“你们公司做灰度测试么&#xff1f;", ”α测试和β测试有什么不一样&#xff1f;“&#xff0…...

【Linux】

Linux零基础入门 列出文件/文件夹新建/切换路径查看当前路径重命名或者移动文件夹拷贝文件/文件夹删除文件夹设置环境变量编辑文本文件压缩和解压查看cpu的信息查看/杀死进程查看进程的CPU和内存占用重定向日志场景一场景二场景三场景四 列出文件/文件夹 命令&#xff1a;Ls(L…...

「 网络安全常用术语解读 」网络攻击者的战术、技术和常识知识库ATTCK详解

引言&#xff1a;随着网络攻击手段的不断升级和多样化&#xff0c;网络安全领域面临着越来越严峻的挑战。为了帮助网络安全专业人员更好地识别和防御网络攻击&#xff0c;MITRE公司创建了ATT&CK框架&#xff0c;以提供一个统一且结构化的方法来描述网络攻击者的行为和技巧。…...