문제는 Date스택 오버플로에 시간이 표시되는 방식과 유사한 경과 시간을 나타내는 문자열로 JavaScript를 형식화하는 방법입니다.
예 :
- 1 분 전
- 1 시간 전
- 1 일 전
- 1 개월 전
- 1 년 전
답변
function timeSince(date) {
var seconds = Math.floor((new Date() - date) / 1000);
var interval = Math.floor(seconds / 31536000);
if (interval > 1) {
return interval + " years";
}
interval = Math.floor(seconds / 2592000);
if (interval > 1) {
return interval + " months";
}
interval = Math.floor(seconds / 86400);
if (interval > 1) {
return interval + " days";
}
interval = Math.floor(seconds / 3600);
if (interval > 1) {
return interval + " hours";
}
interval = Math.floor(seconds / 60);
if (interval > 1) {
return interval + " minutes";
}
return Math.floor(seconds) + " seconds";
}
var aDay = 24*60*60*1000;
console.log(timeSince(new Date(Date.now()-aDay)));
console.log(timeSince(new Date(Date.now()-aDay*2)));답변
이 경우 과잉이 될 수 있지만 기회에 moment.js 가 표시 되면 정말 좋습니다 !
Moment.js는 자바 스크립트 날짜 / 시간 라이브러리이며 이러한 시나리오에 사용하려면 다음을 수행하십시오.
moment(yourdate).fromNow()http://momentjs.com/docs/#/displaying/fromnow/
2018 부록 : Luxon 은 새로운 현대 라이브러리이며 살펴볼 가치가 있습니다!
답변
어렵지는 않지만 확인하지는 않았지만 Stack Exchange 사이트는 jquery.timeago플러그인 을 사용하여 이러한 시간 문자열을 생성 한다고 생각합니다 .
플러그인을 사용하는 것은 매우 쉽고 깨끗하며 자동으로 업데이트됩니다.
다음은 플러그인 홈페이지에서 제공하는 간단한 샘플입니다.
먼저 jQuery와 플러그인을로드하십시오.
<script src="jquery.min.js"
type="text/javascript"></script>
<script src="jquery.timeago.js"
type="text/javascript"></script>이제 DOM 준비 타임 스탬프에 첨부하자 :
jQuery(document).ready(function() {
jQuery("abbr.timeago").timeago(); });이것은 모든 바뀝니다
abbr의 클래스와 요소timeago와 제목에 ISO 8601 타임 스탬프 :<abbr: 이런 일에
class="timeago"
title="2008-07-17T09:24:17Z">July 17,
2008</abbr>
<abbr class="timeago" title="July 17,수익률 : 년 전에. 시간이 지남에 따라 타임 스탬프가 자동으로 업데이트됩니다.
2008">about a year ago</abbr>
답변
그러면 ‘2 일 전”10 분 후 ‘와 같은 과거 및 이전 시간 형식이 표시되며 Date 객체, 숫자 타임 스탬프 또는 날짜 문자열을 전달할 수 있습니다.
function time_ago(time) {
switch (typeof time) {
case 'number':
break;
case 'string':
time = +new Date(time);
break;
case 'object':
if (time.constructor === Date) time = time.getTime();
break;
default:
time = +new Date();
}
var time_formats = [
[60, 'seconds', 1], // 60
[120, '1 minute ago', '1 minute from now'], // 60*2
[3600, 'minutes', 60], // 60*60, 60
[7200, '1 hour ago', '1 hour from now'], // 60*60*2
[86400, 'hours', 3600], // 60*60*24, 60*60
[172800, 'Yesterday', 'Tomorrow'], // 60*60*24*2
[604800, 'days', 86400], // 60*60*24*7, 60*60*24
[1209600, 'Last week', 'Next week'], // 60*60*24*7*4*2
[2419200, 'weeks', 604800], // 60*60*24*7*4, 60*60*24*7
[4838400, 'Last month', 'Next month'], // 60*60*24*7*4*2
[29030400, 'months', 2419200], // 60*60*24*7*4*12, 60*60*24*7*4
[58060800, 'Last year', 'Next year'], // 60*60*24*7*4*12*2
[2903040000, 'years', 29030400], // 60*60*24*7*4*12*100, 60*60*24*7*4*12
[5806080000, 'Last century', 'Next century'], // 60*60*24*7*4*12*100*2
[58060800000, 'centuries', 2903040000] // 60*60*24*7*4*12*100*20, 60*60*24*7*4*12*100
];
var seconds = (+new Date() - time) / 1000,
token = 'ago',
list_choice = 1;
if (seconds == 0) {
return 'Just now'
}
if (seconds < 0) {
seconds = Math.abs(seconds);
token = 'from now';
list_choice = 2;
}
var i = 0,
format;
while (format = time_formats[i++])
if (seconds < format[0]) {
if (typeof format[2] == 'string')
return format[list_choice];
else
return Math.floor(seconds / format[2]) + ' ' + format[1] + ' ' + token;
}
return time;
}
var aDay = 24 * 60 * 60 * 1000;
console.log(time_ago(new Date(Date.now() - aDay)));
console.log(time_ago(new Date(Date.now() - aDay * 2)));답변
다음은 날짜를 문자열로 입력 할 수 있고 “73 초”대신 “1 분”과 같은 범위를 표시 할 수있는 Sky Sander 솔루션의 일부 수정입니다.
var timeSince = function(date) {
if (typeof date !== 'object') {
date = new Date(date);
}
var seconds = Math.floor((new Date() - date) / 1000);
var intervalType;
var interval = Math.floor(seconds / 31536000);
if (interval >= 1) {
intervalType = 'year';
} else {
interval = Math.floor(seconds / 2592000);
if (interval >= 1) {
intervalType = 'month';
} else {
interval = Math.floor(seconds / 86400);
if (interval >= 1) {
intervalType = 'day';
} else {
interval = Math.floor(seconds / 3600);
if (interval >= 1) {
intervalType = "hour";
} else {
interval = Math.floor(seconds / 60);
if (interval >= 1) {
intervalType = "minute";
} else {
interval = seconds;
intervalType = "second";
}
}
}
}
}
if (interval > 1 || interval === 0) {
intervalType += 's';
}
return interval + ' ' + intervalType;
};
var aDay = 24 * 60 * 60 * 1000;
console.log(timeSince(new Date(Date.now() - aDay)));
console.log(timeSince(new Date(Date.now() - aDay * 2)));답변
humanized_time_span을보고 싶을 수도 있습니다 : https://github.com/layam/js_humanized_time_span
이 프레임 워크는 불가지론적이고 완벽하게 사용자 정의 할 수 있습니다.
스크립트를 다운로드 / 포함하면 다음과 같이 할 수 있습니다.
humanized_time_span("2011-05-11 12:00:00")
=> '3 hours ago'
humanized_time_span("2011-05-11 12:00:00", "2011-05-11 16:00:00)
=> '4 hours ago'또는 이것조차도 :
var custom_date_formats = {
past: [
{ ceiling: 60, text: "less than a minute ago" },
{ ceiling: 86400, text: "$hours hours, $minutes minutes and $seconds seconds ago" },
{ ceiling: null, text: "$years years ago" }
],
future: [
{ ceiling: 60, text: "in less than a minute" },
{ ceiling: 86400, text: "in $hours hours, $minutes minutes and $seconds seconds time" },
{ ceiling: null, text: "in $years years" }
]
}
humanized_time_span("2010/09/10 10:00:00", "2010/09/10 10:00:05", custom_date_formats)
=> "less than a minute ago"자세한 내용은 문서를 읽으십시오.
답변
위의 기능을 다음과 같이 변경했습니다.
function timeSince(date) {
var seconds = Math.floor(((new Date().getTime()/1000) - date)),
interval = Math.floor(seconds / 31536000);
if (interval > 1) return interval + "y";
interval = Math.floor(seconds / 2592000);
if (interval > 1) return interval + "m";
interval = Math.floor(seconds / 86400);
if (interval >= 1) return interval + "d";
interval = Math.floor(seconds / 3600);
if (interval >= 1) return interval + "h";
interval = Math.floor(seconds / 60);
if (interval > 1) return interval + "m ";
return Math.floor(seconds) + "s";
}그렇지 않으면 “75 분”(1 시간에서 2 시간 사이)과 같은 것들이 표시됩니다. 또한 입력 날짜가 Unix 타임 스탬프라고 가정합니다.
