JavaScript实时日期时间显示：如何让getDate返回值补零为两位数字？

日期补0的快速修复 #

你只需要把日期部分的date.getDate()替换成和时间一样的补0逻辑就行，完全不会破坏原有脚本：

// 替换原来的today变量定义
var dayNum = ('0' + date.getDate()).substr(-2);
var today = `${dayName} ${dayNum} ${monthName}`;

如果想用更语义化的写法，也可以用ES6的padStart方法，效果完全一致：

var dayNum = String(date.getDate()).padStart(2, '0');

现有方案复杂度评估 #

你的当前方案不算复杂，逻辑清晰直白，新手也能快速看懂。不过可以做些优化让代码更简洁、易维护：

• 补0逻辑：padStart(2, '0')比字符串拼接+substr(-2)的语义更强，一眼就能看出是补0到两位
• 日期格式化：不用手动维护星期和月份数组，直接用浏览器原生的Intl.DateTimeFormatAPI，减少硬编码的同时更可靠

优化后的完整代码 #

JavaScript #

function showDateTime() {
  const currentDate = document.getElementById("date");
  const currentTime = document.getElementById("time");
  const date = new Date();

  // 格式化日期：星期缩写 + 两位日期 + 月份缩写
  const dateFormatter = new Intl.DateTimeFormat('en-US', {
    weekday: 'short',
    day: '2-digit',
    month: 'short'
  });
  const today = dateFormatter.format(date);

  // 格式化时间：24小时制的两位时:分:秒
  const timeFormatter = new Intl.DateTimeFormat('en-US', {
    hour: '2-digit',
    minute: '2-digit',
    second: '2-digit',
    hour12: false
  });
  const time = timeFormatter.format(date);

  currentDate.innerText = today;
  currentTime.innerText = time;
}
setInterval(showDateTime, 1000);

HTML #

<div id="date"></div>
<div id="time"></div>

额外说明 #

• padStart是现代浏览器都支持的ES6方法，要是需要兼容极旧浏览器，你原来的补0逻辑完全没问题
• Intl.DateTimeFormat是原生API，自动处理本地化格式，不用自己维护星期、月份数组，减少出错概率

内容的提问来源于stack exchange，提问作者user1406440