서버에서 시간을 받아와서 웹 브라우저 상에서
setTimeout()으로 구현된 예제를 보고 있노라니..
pc의 시간과 다르게 가서 고민..
생각해보니까
setTimeout은 1회성으로
내부 루틴에서 처리할거 처리하고 지정을 지정하면
조금씩 조금씩 시간이 밀려 날 걸로 예상이 된다.
그런 이유로 setInterval이 조금은 더 정확한 시간간격으로 수행이 가능하지 않을까? 라고 예상
[링크 : http://www.w3schools.com/js/js_timing.asp]
[링크 : http://honjoo.tistory.com/32]
[링크 : http://charlie0301.blogspot.com/2014/11/javascript-timer.html]
<body onload="setInterval(function(){ function1(); function2();}, 500);">
[링크 : http://stackoverflow.com/questions/6660755/can-a-body-tag-hold-multiply-onload-setinterval]
----
setInterval 버전
<body onload="setInterval(function(){realtimeClock();},1000);"> <script type="text/javascript"> var systime = 20; function realtimeClock() { var cTime = new Date((systime++)*1000); // EN672 System Time svrTime.innerHTML = getTimeStamp(cTime); } function getTimeStamp(d) { var s = leadingZeros(d.getFullYear(), 4) + '-' + leadingZeros(d.getMonth() + 1, 2) + '-' + leadingZeros(d.getDate(), 2) + ' ' + leadingZeros(d.getHours(), 2) + ':' + leadingZeros(d.getMinutes(), 2) + ':' + leadingZeros(d.getSeconds(), 2); return s; } function leadingZeros(n, digits) { var zero = ''; n = n.toString(); if (n.length < digits) { for (i = 0; i < digits - n.length; i++) zero += '0'; } return zero + n; } </script> <div id="svrTime"></div> </body> |
setTimeout 버전
<body onload="realtimeClock();"> <script type="text/javascript"> var systime = 20; function realtimeClock() { var cTime = new Date((systime++)*1000); // EN672 System Time svrTime.innerHTML = getTimeStamp(cTime); setTimeout("realtimeClock()", 1000); } function getTimeStamp(d) { var s = leadingZeros(d.getFullYear(), 4) + '-' + leadingZeros(d.getMonth() + 1, 2) + '-' + leadingZeros(d.getDate(), 2) + ' ' + leadingZeros(d.getHours(), 2) + ':' + leadingZeros(d.getMinutes(), 2) + ':' + leadingZeros(d.getSeconds(), 2); return s; } function leadingZeros(n, digits) { var zero = ''; n = n.toString(); if (n.length < digits) { for (i = 0; i < digits - n.length; i++) zero += '0'; } return zero + n; } </script> <div id="svrTime"></div> </body> |
완전하진 않지만 대충.. refresh 해서
setInterval은 2초 늦고 setTimeout은 1초 정도 늦게 시작 했으나
setTimeout은 30분이 지난 시점에서 상당히 벗어나 있음
'Programming > javascript & HTML' 카테고리의 다른 글
| ul li 메뉴 .. 2? (0) | 2016.01.11 |
|---|---|
| div 쪼금 이해 될락말락... (0) | 2016.01.08 |
| html5 live video streaming... (0) | 2015.11.23 |
| div span 블럭구조 및 원형테두리 (0) | 2015.09.23 |
| ul / li로 메뉴 꾸미기 (0) | 2015.09.16 |
