日期计算器

日期计算器

项目简介

日期计算器是一款零依赖的纯前端日期工具，把日常生活中最常用的三种日期计算放进一个页面：两个日期之间相隔多少天、某个日期往前或往后加几天/几周/几个月/几年是哪一天、以及任意日期是星期几、是当年的第几天、还剩多少天。三种计算各占一张卡片，选择日期即出结果，无需点击计算按钮。

整个应用由单个 HTML 文件承载，零依赖、零后端，打开即用。

核心功能

• 间隔天数计算：选择开始与结束日期，立即显示相差天数，并自动换算成约等于几周、几个月、几年；结束日期在前时正确显示负数与方向提示。

• 一键交换：开始与结束日期一键互换，结果实时翻转。

• 日期加减推算：以任意日期为基准，支持加减天数、周数、月数、年数，结果同时显示对应星期。

• 月末安全：加减月数时自动处理大小月与闰年 2 月（如 1 月 31 日加 1 个月得到 2 月 28/29 日），不会溢出到下个月。

• 日期信息查询：任意日期的星期、当年第几天、当年剩余天数、距今天数。

• 快捷日期：一键填入今天、明天、昨天、本月 1 号、今年 1 月 1 日、明年元旦。

技术架构

应用采用「输入与模式层 → 日期计算引擎 → 结果展示层」的简洁三层结构，全部运行在浏览器端，无后端依赖。

• 输入与模式层：三张卡片分别承载间隔计算（两个日期选择器 + 交换按钮）、日期加减（基准日期 + 增减量 + 单位下拉）、日期信息（快捷按钮 + 任意日期）；原生 input[type=date] 提供移动端友好的日期选择。

• 日期计算引擎：间隔计算模块用「毫秒差 ÷ 86400000」得出天数并按 7 / 30.44 / 365.25 换算周月年；日期推算模块用 setDate / setMonth / setFullYear 实现加减，对月末与闰年做夹取处理；日期信息模块基于日期序号计算星期、年内第几天与剩余天数。

• 结果展示层：大字号结果卡片展示天数或推算日期，次级文案补充换算明细；日期信息面板以四宫格展示星期、当年第几天、剩余天数、距今天数。

核心逻辑说明

间隔计算：Math.round((b - a) / 86400000)——用两个日期对象相减得到毫秒差，再除以一天的毫秒数并取整，避免闰秒与夏令时干扰（代码内构造日期时固定到本地零点）。

日期加减：addDate(base, n, unit) 统一处理四种单位——天数与周数直接 setDate 偏移；月数先将日期夹到当月 1 日做 setMonth，再用当月最后一天夹取原日期，保证 1 月 31 日 + 1 个月不会变成 3 月 3 日；年数用 setFullYear 并校验月份是否回退，处理 2 月 29 日加 1 年的边界。

日期信息：dayOfYear = 差值(今年1月1日, 目标) + 1；当年剩余天数用「下一年 1 月 1 日 - 今年 1 月 1 日」的天数减去已过天数，自动适配平年闰年。

技术栈

使用方式

直接用浏览器打开 index.html 即可使用；也可通过任意静态文件服务器托管后访问。

项目地址：开发者作品展览馆

亮点与价值

• 零依赖、开箱即用：单个 HTML 文件承载全部能力，部署只需一个静态服务器。

• 即时反馈：选择日期即出结果，无需点击计算按钮，交互零摩擦。

• 边界严谨：闰年 2 月、月末溢出、平闰年天数全部正确处理。

• 实用细节：周/月/年自动换算、方向提示、一键交换，覆盖真实日程与项目排期场景。