如何使用Moment.js?

我无法关注Moment.js文档 ,需要一些设置帮助。 我在我的网页上正确引用了moment.min.js文件,如下所示:

  

来到我的网页的HTML部分,我在同一页面上有两个不同的日期时间:

发布日期

  June 09, 2012  

上次修改日期

  June 9, 2012 ~ 12:32  

重要! 解析的相对日期不应超过“昨天”。 至于其他所有内容, 标签应显示没有JavaScript的确切日期 – 即Moment.js不应触及或解析过去“昨天”的日期。

现在,为了使库完成前面提到的工作,我需要在库引用之后调用一个函数。 所以,问题是,该function应该是什么? (使用jQuery很好,因为我已经在我的网页上引用了库。)

请指出你的问题。 我假设你想要一个相对日期解析,最大值应该是“昨天”。

我从未使用过moment.js,但就文档而言,它非常简单。

使用var now = moment(); 作为你当前的日期。 然后每次在你的DOM中解析-tag var time = moment($(e).attr('datetime'));

要检查差异,请使用diff()方法:

 if(now.diff(time, 'days') <= 1) { // getting the relative output } 

使用var ago = now.from(time)获取相对输出,并用您ago变量替换DOM中的时间。

根据评论更新

好的,未经测试,但这是基本的想法:

更新了代码。

 var now = moment(); $('time').each(function(i, e) { var time = moment($(e).attr('datetime')); if(now.diff(time, 'days') <= 1) { $(e).html('' + time.from(now) + ''); } }); 

您还可以使用moment().calendar()函数,该函数将为您接近今天的日期格式(从今天起最多一周):

 $('time').each(function(i, e) { var time = moment($(e).attr('datetime')); $(e).html('' + time.calendar() + ''); });​ 

您可以使用以下代码自定义格式字符串:

 moment.calendar = { lastDay : '[Yesterday at] LT', sameDay : '[Today at] LT', nextDay : '[Tomorrow at] LT', lastWeek : '[last] dddd [at] LT', nextWeek : 'dddd [at] LT', sameElse : 'L' }; 

如果您对昨天之前的日期格式不感兴趣,只需将lastWeeknextWeek的格式更改为完整日期时间格式(例如'L' )。


更新2013-09-06显然它有一个新的语法,也可以让你本地化它:

 moment.lang('en', { calendar: { lastDay : '[Yesterday at] LT', sameDay : '[Today at] LT', nextDay : '[Tomorrow at] LT', lastWeek : '[last] dddd [at] LT', nextWeek : 'dddd [at] LT', sameElse : 'L' } }); 

感谢@JohannesKlauß的代码。 这基本上是我如何执行他的答案以及我如何引用我网站上的代码。

   

其中, moment.min.js是Moment.js库,而moment.executor.js有这段代码(由Johannes提供):

 jQuery(document).ready(function($){ var now = moment(); $('time').each(function(i, e) { var time = moment($(e).attr('datetime')); if(now.diff(time, 'days') <= 1) { $(e).html('' + time.from(now) + ''); } }); }); 

PS:您实际上可以编辑moment.min.js并在其末尾添加上述代码。 这样,您将保存一个额外的HTTP请求。 :P

扩展@ its_me的实现,这是一个版本

  • 使用给定的类更新所有元素
  • 让它们每分钟都更新(所以’1分钟前’成为’2分钟前”
  • 从现在起+ 1天后切换到不同的格式(例如,上周二晚上11:45)

这是一个可以玩的JSFiddle 。

你的HTML:

  

JS包括:

 (function () { // Define a function that updates all relative dates defined by