如何使用 Javascript 将 ISO 8601 日期格式化为更易读的格式？

Question

我正在使用 API 从 post 调用日期。

2015-11-09T10:46:15.097Z

我希望我的日期格式如下：

09/11/2015

然后，稍后，我想将它们插入我的 HTML，如下所示：

$(data).each(function(){
    var html = '<randomhtml> '+this.created_at+' <randomhtml>
    $('#stream').append(html);
});

有谁知道如何将我的日期更改为正确的格式？

Answer 1

最简单的方法就是使用字符串

$(data).each(function(){

    var date = this.created_at.split('T') // split on the "T"   -> ["2015-11-09", "10:..."]
                              .shift()    // get the first part -> "2015-11-09"
                              .split('-') // split again on "-" -> ["2015", "11", "09"]
                              .reverse()  // reverse the array  -> ["09", "11", "2015"]
                              .join('/')  // join with "/"      -> "09/11/2015"

    var html = '<randomhtml> ' + date + ' <randomhtml>';
    $('#stream').append(html);
});

因为它是一个 UTC 日期，只传递它 new Date() 会增加时区的差异，并不总是输出正确的日期。
如果您需要验证日期，可以使用正则表达式检查有效的 UTC 日期。

Answer 2

所有浏览器

使用您正在使用的源格式设置日期格式的最可靠方法是应用以下步骤：

使用您的时间字符串作为 new Date()
用.getDate()、.getMonth()和.getFullYear()分别得到日、月、年
根据您的目标格式将各个部分粘贴在一起

下面的 format 函数向您展示了结合这四个步骤的最佳方式：

var date = '2015-11-09T10:46:15.097Z';

function format(input) {
    var date = new Date(input);
    return [
       ("0" + date.getDate()).slice(-2),
       ("0" + (date.getMonth()+1)).slice(-2),
       date.getFullYear()
    ].join('/');
}

document.body.innerHTML = format(date); // OUTPUT : 09/11/2015

（另见 this Fiddle）。

备注

虽然此方法适用于所有浏览器，但如果您需要支持与 IE8 一样旧的浏览器，则需要在 new Date(input) 之前执行额外的步骤来解析 ISO 8601 格式--。请参阅 Javascript JSON Date parse in IE7/IE8 returns NaN 中已接受的答案，以了解执行此操作的功能。

仅限现代浏览器

您也可以使用内置的 .toLocaleDateString 方法为您进行格式化。您只需要传递正确的语言环境和选项以匹配正确的格式，不幸的是，只有现代浏览器支持 (*) :

var date = '2015-11-09T10:46:15.097Z';

function format(input) {
    return new Date(input).toLocaleDateString('en-GB', {
        year: 'numeric',
        month: '2-digit',
        day: '2-digit'
    });
}

document.body.innerHTML = format(date); // OUTPUT : 09/11/2015

（另见 this Fiddle）。

(*) According to the MDN, "Modern browsers" means Chrome 24+, Firefox 29+, IE11, Edge12+, Opera 15+ & Safari nightly build

Answer 3

对于日期操作 momentjs 库非常有用。

如果您想使日期格式取决于用户所在的国家/地区，您还可以使用 formatjs。

Answer 4

这可以解决您的问题

var date = new Date('2015-11-09T10:46:15.097Z');
alert((date.getMonth() + 1) + '/' + date.getDate() + '/' +  date.getFullYear());

输出将为“2015 年 9 月 11 日”

Answer 5

重新格式化日期字符串的最简单和最可靠的方法是重新格式化字符串。因此，使用 split（或 match）获取值并按您想要的顺序 return 它们，忽略您不需要的位不需要，例如：

function isoToDMY(s) {
   var b = s.split(/\D/);
   return b[2] + '/' + b[1] + '/' + b[0];
}

document.write(isoToDMY('2015-11-09T10:46:15.097Z'));

如果您希望输出日期也考虑主机系统时区（例如，UTC+0530 时区中的 2015-11-09T20:46:15Z 将是 2015-11-10T02:16:15Z） ), 那么你应该手动将其解析为 Date 对象，然后获取年月日值。

库可以帮助解析，但是解析和验证值的函数只有几行。

如何使用 Javascript 将 ISO 8601 日期格式化为更易读的格式？

How can I format an ISO 8601 date to a more readable format, using Javascript?

html

javascript

date

date-format

time-format

所有浏览器

备注

仅限现代浏览器