js 现在的时间距离本月月底的倒计时(html)

现在的时间距离本月月底的倒计时

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>现在的时间距离本月月底的倒计时</title><style>body {padding: 0;margin: 0;}.index-time {color: #333333;text-align: left;font-size: 28px;line-height: 80px;width: 550px;margin: 0 auto;}.index-date {color: #ff5722;}</style>
</head><body><div class="index-time"><div class="index-date" id="date"></div><div class="index-date" id="reachDate"></div><div class="index-time-son"><div class="time-son-m" id="timer">距离指定日期:<span class="time-hei time-hei1">00</span><span class="time-hei time-hei2">00</span> 小时<span class="time-hei time-hei3">00</span><span class="time-hei time-hei4">00</span></div></div></div><script>function getDays() {// 1.获取本月的天数var date = new Date();var year = date.getFullYear();var mouth = date.getMonth() + 1;var days = date.getDate();// 2.本月的天数 - 用本月已经过去的时间 (天数 小时 分钟 秒数)var myDate = date.getDate();var hours = date.getHours();var min = date.getMinutes();var second = date.getSeconds();var Milliseconds = date.getMilliseconds();// 当前日期时间document.getElementById('date').innerHTML = '当前时间:' + year + '-' + mouth + '-' + days + ' ' + hours + ':' + min + ':' + second;if (mouth == 2) {days = year % 4 == 0 ? 29 : 28;} else if (mouth == 1 || mouth == 3 || mouth == 5 || mouth == 7 || mouth == 8 || mouth == 10 || mouth == 12) {days = 31;} else {days = 30;}// 到达日期document.getElementById('reachDate').innerHTML = '指定时间:' + year + '-' + mouth + '-' + days;// 天数相减var differenceday = days - myDate - 1;differenceday = differenceday > 9 ? differenceday : "0" + differenceday;// 小时相减var differencehours = 1 * 23 - hours;differencehours = differencehours > 9 ? differencehours : "0" + differencehours;// 分钟相减var differencemin = 1 * 59 - min;differencemin = differencemin > 9 ? differencemin : "0" + differencemin;// 秒数相减var differencesecond = 1 * 59 - second;differencesecond = differencesecond > 9 ? differencesecond : "0" + differencesecond;// 渲染到页面上var timer = document.getElementById('timer');var span = timer.getElementsByTagName('span');span[0].innerHTML = differenceday;span[1].innerHTML = differencehours;span[2].innerHTML = differencemin;span[3].innerHTML = differencesecond;};//倒计时var timer = window.setInterval(function () {getDays();}, 1000);</script>
</body></html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/238168.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

博客引擎 hugo intro 入门介绍+安装笔记

hugo 博客引擎 Hugo 是一个流行的静态网站生成器&#xff0c;它被广泛用于创建博客和静态网站。 静态网站生成器&#xff1a;Hugo 是一个静态网站生成器&#xff0c;它将你的博客内容转换为 HTML、CSS 和 JavaScript 文件&#xff0c;这些文件可以直接部署到 Web 服务器上。相…

【C语言】动态内存管理基础知识——动态通讯录,如何实现通讯录容量的动态化

引言 动态内存管理的函数有&#xff1a;malloc,calloc,ralloc,free,本文讲解动态内存函数和使用&#xff0c;如何进行动态内存管理,实现通讯录联系人容量的动态化&#xff0c;对常见动态内存错误进行总结。 ✨ 猪巴戒&#xff1a;个人主页✨ 所属专栏&#xff1a;《C语言进阶》…

老毛桃软碟通制作启动盘装机硬盘安装系统

&#x1f3ac; 艳艳耶✌️&#xff1a;个人主页 &#x1f525; 个人专栏 &#xff1a;《产品经理如何画泳道图&流程图》 ⛺️ 越努力 &#xff0c;越幸运 目录 一、老毛桃制作winPE镜像 1、简介 2、老毛桃的主要功能包括&#xff1a; 3、准备 4、制作启动盘流程 5…

vue项目npm run build报错npm ERR! missing script: build(已解决)

vue项目npm run build报错npm ERR! missing script: build&#xff08;已解决&#xff09; 错误描述&#xff1a; 今天准备打包vue项目上线是出现下列错误&#xff1a; 找了很多解决方法都不行&#xff0c;最后打开自己的package.json文件发现&#xff1a;build后面多了个&a…

内皮素-1(Endothelin-1 )ELISA kit

灵敏、快速的内皮素-1 ELISA试剂盒&#xff0c;适用于心血管和应激相关研究 内皮素&#xff08;Endothelin, ET&#xff09;是由血管内皮细胞产生的异肽&#xff0c;具有强大的血管收缩活性。这种肽由三个独立的基因编码&#xff0c;经过加工产生39个残基的 大ET 分子&#xff…

【科普知识】什么是步进驱动器、驱动模式及驱动的方法?

我们已经知道步进电机就是一种将电脉冲信号转化为角位移的执行机构。那么如何精准地控制电机的速度和位置呢&#xff1f;这就需要一种驱动器的装置。 1.什么是步进驱动器&#xff1f; 电机控制原理图 步进驱动器是一种能使步进电机运转的功率放大器&#xff0c;能把控制器发来…

Zabbix自动发现并注册已安装agent的主机

先在被监控主机上安装好zabbix-agent 然后登录zabbix网页 点击发现动作后会出现第三步 然后编辑操作&#xff0c;发现后加入到主机组群 然后编辑发现规则 然后就可以在主机列表中看到被发现的主机。

window下搭建Rocketmq服务及测试demo

下载地址&#xff1a;下载 | RocketMQ 一. RocketMQ部署 系统:Windows7;环境:JDK1.8、Maven3.3、Git&#xff1b; 下载 | RocketMQ 1.1 下载&#xff0c; 进入RocketMQ官网http://rocketmq.apache.org/docs/quick-start/&#xff0c; 这里以编写时的最新版本为例&#…

大疆又出新品:户外电源

大疆创新最近发布了两款强大的户外电源&#xff1a;DJI Power 1000 和 DJI Power 500。这两款产品都具有高效储能、便携易用、安全放心、续航强大等优势&#xff0c;让你在户外探险时拥有更多可能性。 DJI Power 1000 电池容量&#xff1a;1024 瓦时&#xff08;约 1 度电&…

光条中心线提取-Steger算法 [OpenCV]

在线结构光视觉传感器中&#xff0c;由线激光器发射出的线结构光&#xff0c;在本质上为一个连续且具有一定厚度的空间光平面&#xff0c;而在目标表面上所形成的具有一定宽度的光条特征&#xff0c;即为该光平面与目标表面相交而成的交线。在该空间光平面的厚度方向上&#xf…

0x43 线段树

0x43 线段树 线段树&#xff08;Segment Tree&#xff09;是一种基于分治思想的二叉树结构&#xff0c;用于在区间进行信息统计。与按照二进制位&#xff08;2的次幂&#xff09;进行区间划分的树状数组相比&#xff0c;线段树是一种更加通用的结构&#xff1a; 1.线段树的每…

组播地址段及其作用

作用 组播(Multicast)传输:在发送者和每一接收者之间实现点对多点网络连接。如果一台发送者同时给多个的接收者传输相同的数据&#xff0c;也只需复制一份的相同数据包。它提高了数据传送效率。减少了骨干网络出现拥塞的可能性。 地址段 组播协议的地址在 IP 协议中属于 D 类…

Hadoop 集群环境搭建

目录 第一部分&#xff1a;系统安装... 3 1&#xff1a;图形化安装... 3 2&#xff1a;选择中文... 3 3&#xff1a;安装选项... 3 4&#xff1a;软件选项... 4 5&#xff1a;安装位置... 4 6&#xff1a;网络配置... 6 7&#xff1a;开始安装... 7 8&#xff1a;创建用户... 7…

【密码学引论】密码协议

定义&#xff1a;两个或者两个以上参与者为了完成某一特定任务而采取的一系列执行步骤密码协议&#xff1a;Kerberos、IPSec、SSL、SET算法是低层次上的概念&#xff0c;而协议是高层次上的概念&#xff0c;协议建立在算法的基础上。所有密码协议都容易受中间人攻击&#xff0c…

TypeScript实战——ChatGPT前端自适应手机端,PC端

前言 「作者主页」&#xff1a;雪碧有白泡泡 「个人网站」&#xff1a;雪碧的个人网站 可以在线体验哦&#xff1a;体验地址 文章目录 前言引言先看效果PC端手机端 实现原理解释 包的架构目录 引言 ChatGPT是由OpenAI开发的一种基于语言模型的对话系统。它是GPT&#xff08;…

esp32-s3训练自己的数据进行目标检测、图像分类

esp32-s3训练自己的数据进行目标检测、图像分类 一、下载项目二、环境三、训练和导出模型四、部署模型五、存在的问题 esp-idf的安装参考我前面的文章&#xff1a; esp32cam和esp32-s3烧录human_face_detect实现人脸识别 一、下载项目 训练、转换模型&#xff1a;ModelAssist…

外汇天眼:我碰到外汇投资骗局了吗?学会这5招,轻松识别外汇诈骗黑平台!

近年来外汇市场因为交易量大、流动性大、不容易被控盘、品种简单、风险相对低等特色&#xff0c;因此吸引不少投资人青睐&#xff0c;成为全球金融市场的热门选择。 然而&#xff0c;市面上充斥许多诈骗集团设立的黑平台&#xff0c;也打着投资外汇的名义行骗&#xff0c;不免会…

25年老品牌 美好蕴育润康守护孕期妈妈的健康之路

孕期是每一位女性人生中最为特殊的阶段。每一位妈妈都期待着健康、快乐的度过每一天。然而&#xff0c;随着孕周的增加&#xff0c;孕期的不适和困扰也随之而来。孕吐、腰酸背痛、便秘等孕期症状让许多妈妈倍感疲惫和焦虑。在这个关键时刻&#xff0c;美好蕴育润康作为25年的老…

【Kafka-Eagle】EFAK告警配置与实践

Kafka-Eagle是一个开源的Kafka集群监控与告警系统&#xff0c;可以帮助用户实现对Kafka集群的实时监控、性能指标收集以及异常告警等功能。下面是关于Kafka-Eagle的告警配置和实践的一般步骤&#xff1a; 安装和配置Kafka-Eagle&#xff1a; 下载最新版本的Kafka-Eagle安装包&a…

Docker 文件和卷 权限拒绝

一 创作背景 再复制Docker影像文件或访问Docker容器内已安装卷上的文件时我们常常会遇到&#xff1a;“权限被拒绝”的错误&#xff0c;在此&#xff0c;您将了解到为什么会出现“权限被拒绝”的错误以及如何解决这个问题。 二 目的 在深入探讨 Docker 容器中的 Permission De…