使用 jquery 将数字输出转换为日期格式

Question

我有以下设置，其中输出日期由 ACF 字段（WordPress 的高级自定义字段插件）创建。然后日期被我的主题（Uncode）放入一个数组中并以这种方式输出。我不想弄乱我的主题文件，所以有没有办法使用 jQuery 将输出日期格式化为所需的格式？

<div class="table-container">
    <div class="output-date">20220501</div>
    <div class="output-date">20230105</div>
    <div class="output-date">20190923</div>
    ... and so on
</div>

我想要的输出：

<div class="table-container">
    <div class="output-date">May 2022</div>
    <div class="output-date">January 2023</div>
    <div class="output-date">September 2019</div>
    ... and so on
</div>

所以月份应该排在前面，并且必须转换为字母而不是数字。日子可以去掉。 有没有办法在 jQuery 中做到这一点？

我尝试过的：

$(".output-date").html(function (index, html) {
      return html.slice(0, html.length - 2) + '<span class="hide-date-part">' + html.slice(html.length - 2) + '</span>';
});

.hide-date-part {
    display: none;
}

这消除了日子，但如果有更好的方法。

Answer 1

这不是 chatGPT 的经典吗？尽管如此，这是我的解决方案

function formatDate(inputDate) {
  const year = inputDate.substring(0, 4);
  const month = inputDate.substring(4, 6);
  const day = inputDate.substring(6, 8);

  // my solution
  const months = 'jan,feb,mar,apr,may,jun,jul,aug,sep,oct,nov,dec'.split(',');
  return months[+month - 1] + ' ' + year
}

function formatElems(selector) {
  document.querySelectorAll(selector).forEach(function(boo) {
    const inputDate = boo.innerText;
    const formattedDate = formatDate(inputDate);
    boo.innerText = formattedDate
  })
}

formatElems('.output-date');

<div class="table-container">
  <div class="output-date">20220501</div>
  <div class="output-date">20230105</div>
  <div class="output-date">20190923</div>
  ... and so on
</div>