setTimeoutは、一定時間後に特定の処理をおこなう(繰り返さずに一度だけ)処理です。setTimeout(function(){
getResult();},200);で、0.2秒ごとに処理を繰り返します。new Date().getTime();から、Date.now()を引いた秒数で表示しています。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Bilbo" rel="stylesheet">
<title>Web font</title>
<style>
body {
font-family: 'Bilbo', cursive;
background: #000;
text-align: center;
font-size:36px;
color:red;
}
h1 {
color: #fff;
font-size: 128px;
margin:0;
}
#remainingDays, #remainingTime {
font-size: 64px;
}
</style>
</head>
<body>
<h1>Q</h1>
<p>
<span id="remainingDays"></span>days <span id="remainingTime"></span> to go
</p>
<script>
function getResult(){
var target = new Date(2020, 04, 01, 10, 0, 0).getTime();
var now = Date.now();
var diff = (target - now) /1000;
var d = Math.floor(diff / 60 / 60/ 24);
diff = diff - 60 * 60 * 24 * d;
var h = Math.floor(diff / 60 / 60);
diff = diff - 60 * 60 * h;
var m = Math.floor(diff / 60);
diff = diff - 60 * m;
var s = Math.floor(diff);
document.getElementById('remainingDays').innerHTML = d;
document.getElementById('remainingTime').innerHTML = padZero(h) + ':' + padZero(m) + ':' + padZero(s);
setTimeout(function(){
getResult();
},200);
}
getResult();
function padZero(n){
return (n < 10) ? '0'+n : n;
}
</script>
</body>
</html>