서버에서 시간을 받아와서 웹 브라우저 상에서
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분이 지난 시점에서 상당히 벗어나 있음
