Unix时间戳转用户时区时间的JavaScript代码故障排查

你的代码没生效主要是几个关键错误导致的，逐个修正就能解决问题：

错误点分析 #

• 选择器不匹配：HTML里的<span>用的是id="epoch"，但JS里调用getElementsByClassName("epoch")查找类名元素，根本找不到目标节点。如果要处理多个带时间戳的元素，建议把HTML里的id改成class；如果只有单个元素，可以用getElementById。
• 时间戳获取错误：parseInt(epoch.item(i))是把DOM元素对象直接转数字，而不是取元素内部的时间戳文本，应该获取元素的textContent或innerText。
• 时间戳单位不匹配：你的时间戳是秒级（1700523189），但new Date()构造函数需要的是毫秒级数值，必须乘以1000才能得到正确的日期。
• 日期格式化方法错误：toDateString()方法不支持传入配置参数，要实现自定义格式的日期，得用toLocaleDateString或者Intl.DateTimeFormat API。

修正后的代码 #

第一步：修改HTML（将id改为class） #

<div id="content">
  <p><span class="epoch">1700523189</span></p>
  <!-- 如果有多个时间戳元素，继续添加class="epoch"的span即可 -->
</div>

第二步：修正JavaScript代码 #

写法一：使用toLocaleDateString

const epochElements = document.getElementsByClassName("epoch");

for (let i = 0; i < epochElements.length; i++) {
  const element = epochElements[i];
  // 解析时间戳并转换为毫秒
  const timestampMs = parseInt(element.textContent.trim()) * 1000;
  const date = new Date(timestampMs);
  
  // 生成用户本地时区的格式化日期
  const formattedDate = date.toLocaleDateString('default', {
    weekday: 'long',
    year: 'numeric',
    month: 'short',
    day: 'numeric'
  });
  
  // 更新元素内容
  element.textContent = formattedDate;
}

写法二：使用Intl.DateTimeFormat（更推荐，性能更好）

const epochElements = document.getElementsByClassName("epoch");
// 提前创建格式化器，避免循环内重复创建
const dateFormatter = new Intl.DateTimeFormat('default', {
  weekday: 'long',
  year: 'numeric',
  month: 'short',
  day: 'numeric'
});

// 用for...of循环遍历元素集合
for (const element of epochElements) {
  const timestampMs = parseInt(element.textContent.trim()) * 1000;
  element.textContent = dateFormatter.format(new Date(timestampMs));
}

修改后，代码会正确将秒级Unix时间戳转换为用户所在时区的指定格式日期，比如输出类似星期三, 2023年 11月 22日（根据用户本地语言和时区自动调整）。

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