如何为date类型input元素设置次日日期值

嘿，这事儿其实挺简单的，我给你一步步拆解怎么实现：

首先，咱们得先获取到那个日期输入框元素，然后计算出次日的日期，最后把日期转成date输入框要求的YYYY-MM-DD格式赋值给它就行。

完整代码示例 #

// 拿到目标输入框
const dateInput = document.getElementById('myDate');

// 创建当前日期的实例
const today = new Date();
// 计算次日：这里要注意用new Date(today)复制一个新对象，避免修改原有的today日期
const tomorrow = new Date(today);
// setDate方法会自动处理跨月、跨年的情况（比如1月31号加1会自动变成2月1号）
tomorrow.setDate(today.getDate() + 1);

// 把日期格式化成YYYY-MM-DD（date输入框只认这个格式）
const year = tomorrow.getFullYear();
// 月份是0开始的（0=1月），所以要加1，用padStart补成两位数字
const month = String(tomorrow.getMonth() + 1).padStart(2, '0');
// 日期同样补成两位
const day = String(tomorrow.getDate()).padStart(2, '0');
const formattedDate = `${year}-${month}-${day}`;

// 给输入框赋值
dateInput.value = formattedDate;

关键细节说明 #

• 为什么要复制Date对象？：因为Date是引用类型，如果直接修改today的日期，会把原对象也改掉，用new Date(today)可以创建一个独立的新日期实例。
• 自动处理跨月跨年：setDate()方法很智能，比如今天是12月31号，加1天后会自动变成次年1月1号，不用咱们手动判断月份和年份的变化。
• 格式必须是YYYY-MM-DD：HTML的date输入框只接受这种格式的字符串，所以一定要把日期转成这种格式，padStart(2, '0')是为了保证月份和日期都是两位（比如1月变成01，5号变成05）。

避坑提醒 #

别图省事用tomorrow.toISOString().split('T')[0]，因为toISOString()返回的是UTC时间，在某些时区下可能会和本地日期不一致，导致设置的日期不是真正的次日。还是手动格式化本地时间更靠谱～

内容的提问来源于stack exchange，提问作者Trọng Koy