循环列表时currentDate仅生效首个项，求时区转日期全量更新方案

核心问题 #

你的代码存在两个关键错误，导致只有首个列表项的日期能正常转换：

1. 循环索引误用：在访问列表项子元素时，你用了外层循环的计数器i（currentItem.children().eq(i)），但每个列表项内部的目标元素是它自身的后代，和循环索引无关。第二次循环时i=1，第二个列表项的子元素索引1大概率不存在，导致currentDate为空，后续日期转换直接失效。
2. 日期字符串处理错误：currentDate + ' GMT+1'.replace(/-/g, "/")里的replace只作用于GMT+1（而这部分根本没有-），原日期字符串中的-没被替换，可能导致浏览器无法正确解析日期格式。

修正后的代码 #

const dateOptions = {
    month: "short",
    day: "numeric"
};

const timeOptions = {
    hour: '2-digit',
    minute: "numeric",
    hour12: true,
    timeZoneName: "short"
};

// 若.test-list是列表容器，取它的所有子列表项；若.test-list本身就是列表项集合，直接用$(".test-list")即可
const listItems = $(".test-list").children();
for (let i = 0; i < listItems.length; i++) {
    const currentItem = $(listItems[i]);
    // 直接在当前列表项内查找目标日期元素，无需用循环索引定位子元素
    const currentDateStr = currentItem.find(".cms-date-time").text().trim();
    
    // 先替换日期字符串里的-为/，再添加时区标识，确保浏览器能正确解析
    const parsedDate = new Date(currentDateStr.replace(/-/g, "/") + ' GMT+1');
    
    // 直接在当前列表项内更新日期和时间元素
    currentItem.find('.date').html(Intl.DateTimeFormat(navigator.language, dateOptions).format(parsedDate));
    currentItem.find('.time').html(Intl.DateTimeFormat(navigator.language, timeOptions).format(parsedDate));
    console.log(parsedDate);
}

关键改动说明 #

• 移除无效的子元素索引：用currentItem.find()直接定位当前列表项内的目标元素，彻底避免循环索引导致的元素找不到问题。
• 修正日期字符串处理：将replace(/-/g, "/")移到currentDateStr上，确保日期格式符合浏览器解析要求。
• 使用let声明循环变量：把var i改成let i，避免闭包导致的变量泄漏问题，同时让循环逻辑更清晰。
• 添加trim()：去除日期字符串前后的空白字符，避免因多余空格导致的解析错误。

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