诸如微博、微信朋友圈之类的社交媒体很喜欢用“刚刚”、“xx分钟之前”、“xx小时之前”、“xx个月之前”来显示内容发布的时间,从而给人一种相对的时间概念,今天我们就来介绍一下通过JavaScript代码来达到调用Unix服务器的时间,从而显示示发布时间是多久前效果。这边的设置不是非常精细,不过掌握原理之后你就可以很方便的自定义时间的截点。

JavaScript代码

/**
 * 【爱鱼客】JavaScript调用Unix服务器时间戳显示发布时间是多久前效果
 * http://www.iyu.co/web/javascript-unix-time-log/
 * @param timespan int Unix时间戳
 * @return timeSpanStr string 转换之后的前台调用所需要的字符串
 */
function Ftime (timespan) {
 var dateTime = new Date(timespan * 1000);
 var year = dateTime.getFullYear();
 var month = dateTime.getMonth() + 1;
 var day = dateTime.getDate();
 var hour = dateTime.getHours();
 var minute = dateTime.getMinutes();
 //当前时间
 var now = Date.parse(new Date()); //typescript转换写法
 var milliseconds = 0;
 var timeSpanStr;
 //计算时间差
 milliseconds = (now / 1000) - timespan;

 //一分钟以内
 if (milliseconds <= 60) {
 timeSpanStr = '刚刚';
 }
 //大于一分钟小于一小时
 else if (60 < milliseconds && milliseconds <= 60 * 60) {
 timeSpanStr = Math.ceil((milliseconds / (60))) + '分钟前';
 }
 //大于一小时小于等于一天
 else if (60 * 60 < milliseconds && milliseconds <= 60 * 60 * 24) {
 timeSpanStr = Math.ceil(milliseconds / (60 * 60)) + '小时前';
 }
 //大于一天小于等于15天
 else if (60 * 60 * 24 < milliseconds && milliseconds <= 60 * 60 * 24 * 30) {
 timeSpanStr = Math.ceil(milliseconds / (60 * 60 * 24)) + '天前';
 }
 //大于一个月小于一年
 else if (60 * 60 * 24 * 30 < milliseconds && milliseconds <= 60 * 60 * 24 * 30 * 12){
 timeSpanStr = Math.ceil(milliseconds / (60 * 60 * 24 * 30)) + '个月前';
 }
 //超过一年显示实际日期
 else {
 timeSpanStr = year + '年' + month + '月' + day + '日 ' + hour + ':' + minute; 
 }
 return timeSpanStr;
}

好啦,基本原理就是调用服务器的时间和发布时间,计算差值(毫秒转为秒),再计算出时间位于哪个区间,再加上对应的时间段后缀。是不是很简单?有问题的话可以在评论区留言!