手順
以下の二つのファイル
- test.html
- test.js
を作成する
test.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>JavaScript Sample</title>
<script type="text/javascript" src="test.js"></script>
<script type="text/javascript">document.addEventListener('DOMContentLoaded', function(){main();});</script>
</head>
<body>
</body>
</html>test.js
var main = function() {
var intervalId = window.setInterval(hello, 1000);
window.setTimeout(function(){console.log("3 seconds");}, 3000);
}
var hello = function() {
console.log("Hello world");
}説明
setInterval
指定時間毎に関数を実行する
引数の単位は[ms]
setTimeout
指定時間になったら関数を1度だけ実行する
引数の単位は[ms]
clearInterval
今回は使用していないがsetIntervalでの繰り返しをとめるときはclearIntervalを使用する
実行結果
1秒毎にコンソールに “Hello World” が表示される
3秒後にコンソールに “3 seconds” と表示される
参考
MDN Web Docs : WindowOrWorkerGlobalScope.setInterval()
MDN Web Docs : WindowOrWorkerGlobalScope.setTimeout()
MDN Web Docs : window.clearInterval