setInterval
一定時間ごとに特定の処理を繰り返す、関数です。
これを使いタイナー処理を行う事でリアルタイムに動く時計や一定時間で画像が変わるスライドショーなどを作る事が出来ます。
ミリ秒
javascriptでは秒数の指定を「ミリ秒」で指定します。
1000 = 1秒
500 = 0.5秒
100 = 0.1秒
<script>
function textTimer() {
document.write('<p>1秒ごとに追加</p>');
}
setInterval('textTimer()',1000);
</script>
DOMを使ったパターン
<body>
<p id="clock"></p>
<script>
function clockTime (){
//ステップ１、現在の時間を取得し「現在の時刻は18時34分23秒です」のようなフォーマットで表示させる
var today = new Date();
var myHours = today.getHours();//時
var myMinutes = today.getMinutes();// 分
var mySeconds = today.getSeconds();// 秒
//もし秒の値が1桁の時は0を付ける
if(mySeconds <=9){
mySeconds = '0'+mySeconds;
}
//もし分の値が1桁の時は0を付ける
if(myMinutes <=9){
myMinutes = '0'+myMinutes;
}
//ステップ２、「現在の時刻は18時34分23秒です」のようなフォーマットに設定した物を変数timerに代入する
var timer = '<span>'+myHours+'</span>:<span>'+myMinutes+'</span>:<span>'+mySeconds+'</span>';
console.log(timer);
document.getElementById('clock').innerHTML = timer;
}
setInterval('clockTime()',1000);
</script>
</body>
コメント