Question

我有一个有效的功能。它将ISO日期转换为正常日期。但是，在我的网站上，我有几个对象，因此将其置于for循环中。但是以某种方式将其混合在一起。当我在实时演示中选择最后一个对象的日期时，其他日期对象突然描述了NaN或日期和月份被互换。
任何帮助，将不胜感激。

let el = document.getElementsByClassName("date");

for (let j = 0; j < el.length; j++) {
    if (el[j]) {
        let date = new Date(el[j].textContent);
        let year = date.getFullYear();
        let month = ("00" + (date.getMonth() + 1)).slice(-2);
        let day = ("00" + date.getDate()).slice(-2);
        el[j].textContent = '${day}.${month}.${year}';
    }
}

Answer 1

当您向00.00.0000构造函数提供Date格式的字符串时，假定您的意思是MM.dd.yyyy。由于您的日期格式为dd.MM.yyyy，因此解析的日期/月份将是错误的，并且在12日之后的几天将完全失败。

console.table([
  "01.01.2020",
  "02.01.2020", 
  "13.01.2020"  
].map(input => ({
  input,
  output: new Date(input).toString()
})));

<script src="https://gh-canon.github.io/stack-snippet-console/console.min.js"></script><style>.as-console-wrapper{display:block;}</style><script>console.config({maximize:true,timeStamps:false})</script>

您仍然可以使用所需的格式；您只需要确保不重新处理格式化的日期即可。因此，一旦应用了格式设置，请添加一个date-formatted类，以便以后可以使用document.querySelectorAll()跳过那些元素：

function formatDates() {
  let el = document.querySelectorAll(".date:not(.date-formatted)");
  for (let j = 0; j < el.length; j++) {
    if (el[j]) {
      let date = new Date(el[j].textContent);
      date = new Date(date.valueOf() + date.getTimezoneOffset() * 6e4);    
      let year = date.getFullYear();
      let month = ("00" + (date.getMonth() + 1)).slice(-2);
      let day = ("00" + date.getDate()).slice(-2);      
      el[j].textContent = `${day}.${month}.${year}`;
      el[j].classList.add("date-formatted");
    }
  }
}
document.querySelector("button").addEventListener("click", formatDates);

<div class="date">2019-01-01</div>
<div class="date">2019-02-01</div>
<div class="date">2019-03-01</div>
<button>format dates (click me twice)</button>

For循环将自己的格式转换为ISO日期

1 个答案: