如何使用jQuery实现12小时制日期与时间的显示？

我之前也碰到过这个需求，在网上搜了一圈没找到特别简易的实现方案，于是自己写了一段代码来解决这个问题，分享给大家：

$(document).ready(function() {
  // 获取当前日期时间对象
  var d = new Date();
  // 处理月份：getMonth()返回0-11，所以加1转为实际月份
  var mm = d.getMonth() + 1;
  var dd = d.getDate();
  var yy = d.getFullYear();
  // 生成12小时制的时分（带AM/PM标识），保证时分是两位数
  var time = d.toLocaleString([], { hour: '2-digit', minute: '2-digit', hour12: true });
  // 拼接日期部分，保证月份和日期为两位数（不足补0）
  var dateStr = (mm < 10 ? '0' : '') + mm + '/' + (dd < 10 ? '0' : '') + dd + '/' + yy;
  // 组合完整的日期时间字符串
  var fullDatetime = dateStr + ' ' + time;
  // 将结果插入到页面指定元素中（这里假设元素id为datetime）
  $('#datetime').text(fullDatetime);
});

关键说明： #

• 月份处理：getMonth()返回的是0到11的数值，所以必须加1才能得到实际的1-12月。
• 补前导零：用三元运算符(mm < 10 ? '0' : '')确保月份和日期始终是两位数格式（比如03月而不是3月）。
• 12小时制时间：toLocaleString的配置参数hour12: true会自动生成带AM/PM的12小时制时间，hour: '2-digit'和minute: '2-digit'保证时分是两位数字。

你只需要把代码中的#datetime替换成你页面中要显示日期时间的元素选择器即可。

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