특정 날짜와 현재 날짜를 비교해서 "x시간 전, x분 전, x초 전, 방금 전" 과 같은 문구를 리턴해주는 javascript 구현.
실제 돌아가는 메커니즘은 구글링만 해도 금방 나오는데, 이해하고 내꺼화하며 적용하기가 쉽지 않았다.
그래도 구현하니 뿌듯함 ㅠㅠ !!!!!
* 구현방법 *
1. BODY 내부
1 2 | <!-- 마지막 댓글달린 시간 --> <div id="commLastTime" class="${board.commLastTime}"></div> | cs |
2. 돌아가도록 선언한 JAVASCRIPT
1 2 3 4 5 6 7 8 9 10 11 | //마지막으로 작성된 댓글시간 출력을 함수로 만들고 function refreshDate(){ $("#commLastTime").text(transferTime( $("#commLastTime").attr("class") ) ); } $(function(){ //마지막으로 작성된 댓글시간 출력을 함수 바로 실행 refreshDate(); //그리고 10초 뒤 또 실행하도록 설정 setInterval(function(){refreshDate()}, 10000); } | cs |
3. 가장 중요한 실제 날짜계산해주는 JAVASCRIPT
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 | //HJS //날짜계산 function transferTime(time){ var now = new Date(); var sYear = time.substring(0,4); var sMonth = time.substring(4,6)-1; var sDate = time.substring(6,8); var sHour = time.substring(8,10); var sMin = time.substring(10,12); var sSecond = time.substring(12,14); var sc = 1000; var today = new Date(sYear,sMonth,sDate,sHour,sMin,sSecond); //지나간 초 var pastSecond = parseInt((now-today)/sc,10); var date; var hour; var min; var str = ""; var restSecond = 0; if(pastSecond > 86400){ date = parseInt(pastSecond / 86400,10); restSecond = pastSecond % 86400; str = date + "일 "; if(restSecond > 3600){ hour = parseInt(restSecond / 3600,10); restSecond = restSecond % 3600; str = str + hour + "시간 "; if(restSecond > 60){ min = parseInt(restSecond / 60,10); restSecond = restSecond % 60; str = str + min + "분 " + restSecond + "초 전"; }else{ str = str + restSecond + "초 전"; } }else if(restSecond > 60){ min = parseInt(restSecond / 60,10); restSecond = restSecond % 60; str = str + min + "분 " + restSecond + "초 전"; }else{ str = str + restSecond + "초 전"; } }else if(pastSecond > 3600){ hour = parseInt(pastSecond / 3600,10); restSecond = pastSecond % 3600; str = str + hour + "시간 "; if(restSecond > 60){ min = parseInt(restSecond / 60,10); restSecond = restSecond % 60; str = str + min + "분 " + restSecond + "초 전"; }else{ str = str + restSecond + "초 전"; } }else if(pastSecond > 60){ min = parseInt(pastSecond / 60,10); restSecond = pastSecond % 60; str = str + min + "분 " + restSecond + "초 전"; }else{ str = pastSecond + "초 전"; } if(str=="0초 전"){ str = "방금 전"; } return str; } | cs |
ㅇ
반응형
'Frontend > JavaScript' 카테고리의 다른 글
[Javascript] File Upload 한 뒤 태그에서 이미지 바로 보여주기 (0) | 2018.07.27 |
---|---|
caret.js 와 atwho.js 이용하여 게시물에서 @로 친구리스트 불러오기 (autocomplete 활용) (0) | 2018.07.20 |
자바스크립트에서 contains 사용? (0) | 2018.07.17 |
페이지 최상단으로 이동시키는 스크립트 (2) | 2018.07.13 |
현재시스템 날짜와 시간 구하는 자바스크립트 (0) | 2018.07.10 |
댓글