javascript - 将数字日期字符串 (dd/mm/yyyy) 转换为具有短月份名称的换行符分隔字符串

Question

function setTableHeader(v,k) {
            for (var i = 0; i <= k; i++) {
                $('.data-date-set').append('<th>' + result1[i] + '</th>');
            }
        }

我得到了名为 setTableHeader 的函数，它获取 (v,k) 。

v 接收日期，例如(动态日期)

"30/03/2020"
"31/03/2020"
"01/04/2020"
"02/04/2020"

它被附加到

<table class="table table-bordered" id="Tablev">
        <tr class="data-date-set">
            <th></th>
        </tr>
    </table>

然后它绘制一个 GridView ，其中将这些日期作为列。输出-

30/03/2020|31/03/2020|01/04/2020
          |          |

但我需要这样的输出-

  30    |   31   |   01
  Mar   |   Mar  |  Apr
 2020   |  2020  |  2020
        |        |

因此，为了实现这一目标，有什么简单的方法可以做到这一点，而不是使用开关。

Answer 1

您可以使用 Date.prototype.toLocaleDateString() 将您的日期转换为合适的格式并应用 String.prototype.replace() 将默认分隔符替换为必需的( \n 、 <br\> 等):

const dates = ['30/03/2020','31/03/2020','01/04/2020','02/04/2020'],
      formatDate = s => 
        new Date(s.split('/').reverse())
          .toLocaleDateString('en-GB',{day:'numeric', month:'short',year:'numeric'})
          .replace(/ /g, "<br\>")
          
$('#Tablev tr').html(
  dates.map(dateStr => `<th>${formatDate(dateStr)}</th>`)
)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table table-bordered" id="Tablev">
  <tr class="data-date-set"></tr>
</table>