将Wallpaper Engine壁纸的24小时制时间转为12小时制求助

核心修改思路 #

要把24小时制转为英文环境的12小时制，需在JavaScript中处理小时转换、添加AM/PM标识，同时可根据需求调整HTML结构来完整显示格式。

修改后的完整代码 #

JavaScript部分

//update time
function upDateTime(){
  var date = new Date();
  var hour = date.getHours();
  var minute = date.getMinutes();
  var second = date.getSeconds();
  
  // 转换为12小时制，0点转为12，13点转为1
  var twelveHour = hour % 12 || 12;
  // 补零确保两位格式
  twelveHour = twelveHour < 10 ? "0" + twelveHour : twelveHour;
  // 判断AM/PM
  var period = hour < 12 ? 'AM' : 'PM';
  
  if(minute < 10){minute = "0" + minute;}
  
  var times = document.getElementById("time").getElementsByTagName("p");
  times[0].innerText = twelveHour;
  times[1].innerText = minute;
  
  // 若HTML已新增p标签，显示AM/PM
  if(times.length > 2){
    times[2].innerText = ' ' + period;
  }
  
  setTimeout(upDateTime, 60 - second);
  //update Day
  if(hour == 0 && upDay == true){
    upDay = false;
    pushDate();
    setTimeout(function(){
      upDay = true;
    },1000*3600*1.01);
  }
}
upDateTime();

HTML部分（新增AM/PM显示标签）

<button id="time" onclick="upDateTime();">
  <p></p>
  :
  <p></p>
  <p></p>
</button>

CSS部分（保持原有布局，可按需调整间距）

#time{
  display: flex;
  gap: 2px;
  align-items: center;
}

关键修改说明 #

• 小时转换：用hour % 12 || 12实现24到12小时制的转换，避免午夜（0点）显示为0，而是显示12
• AM/PM标识：通过hour < 12判断上午/下午，生成对应的英文标识
• 补零处理：对转换后的小时做补零，保证和分钟一致的两位数字格式
• 可选简化方案：若不想修改HTML，可将AM/PM合并到分钟标签中，把times[1].innerText = minute;改为times[1].innerText = minute + ' ' + period;

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