一定時間毎に処理を実行
一定間隔で処理を実行させたい場合はsetInterval関数を使用します。
setIntervalの処理を停止（中断）する場合は、clearInterval関数を使用します。
構文
一定間隔での処理
var intervalId = setInterval(callback, milliseconds);処理の停止（中断）
clearInterval(intervalId);setInterval関数
| 引数名 | 型 | 説明 | |
|---|---|---|---|
| 第一引数 必須 |
callback | function | 第二引数で指定した秒数に達した時に処理する関数 |
| 第二引数 必須 |
milliseconds | number | 処理間隔（ミリ秒） |
clearInterval関数
| 引数名 | 型 | 説明 | |
|---|---|---|---|
| 第一引数 必須 |
intervalId | number | 停止（中断）するsetInterval関数の処理ID（戻り値） |
戻り値
setInterval関数は、処理IDを返します。
第二引数の指定時間（現在の時刻 + 第二引数の秒数）でキューに入れ、指定時間到達後に第一引数で指定した関数を実行します。
到達後、指定関数の処理に関係なく（clearIntervalでリセットされることを除く）、即時に第二引数の指定時間でキューに入れるといった感じで更新と処理が繰り返されます。
実行中のキューや待機中のキューが存在する場合は、指定した時間に到達しても他のキューが終了するまでは処理されず待機のキューとして追加され、順番待ちの状態となります。
デモ
サンプルでは、1秒毎に1を足して表示しています。
サンプルコード
JavaScript
var timer = null,
textObj = null,
execBtn = null,
clearBtn = null,
n = 0;
var startIntervalFunc = function() {
if (!timer) timer = setInterval(execIntervalFunc, 1000);
};
var execIntervalFunc = function() {
n++;
textObj.value = n;
};
var clearIntervalFunc = function() {
// setIntervalの停止
clearInterval(timer);
time = null;
n = 0;
textObj.value = n;
};
textObj = document.getElementById('text');
execBtn = document.getElementById('exec');
clearBtn = document.getElementById('clear');
execBtn.onclick = startIntervalFunc;
clearBtn.onclick = clearIntervalFunc;