setInterval() - 일정한 시간 간격으로 코드를 반복 실행 함.
setInterval() 기본형
var 참조변수 = setInterval( function( ) { 코드 } , 시간 간격( ms ) );
var 참조변수 = setInterval( "코드", 시간 간격( ms ) );
setInterval() 간단 예시
var intv = setInterval( function( ) { i++ }, 3000 );
var intv = setInterval( " i++ ", 3000 );
-> 시간 간격은 1 / 1,000초 단위로 작성해야 함. ex) 3초 ->3000
clearInterval() - clearInterval() 메소드는 setInterval() 메소드를 취소함.
clearInterval() 기본형
clearInterval(참조변수);
setInterval() / clearInterval() 예제
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>setInterval()/clearInterval()</title>
<script>
var addNum = 0;
var subNum = 1000;
var auto_1 = setInterval(function(){
addNum++;
console.log("addNum : " + addNum);
}, 1500)
var auto_2 = setInterval(function(){
subNum--;
console.log("subNum : " + subNum);
}, 1500);
</script>
</head>
<body>
<h1>일정한 시간 간격으로 값 증감시키기</h1>
<h4>콘솔을 열어서 확인 !!!</h4>
<button onclick="clearInterval(auto_1)">증가 정지</button>
<button onclick="clearInterval(auto_2)">감소 정지</button>
</body>
</html>
'JavaScript&JQuery' 카테고리의 다른 글
| [JavaScript] escape( ) unescape( ) encodeURI( ) decodeURI( ) encodeURIComponent( ) decodeURIComponent( ) (0) | 2018.07.09 |
|---|---|
| [JavaScript] location 객체 (0) | 2018.07.09 |
| [JavaScript] Screen 객체 (0) | 2018.07.09 |
| [JavaScript] setTimeout() / clearTimeout() (0) | 2018.07.08 |
| [JavaScript] 자바스크립트 실행 순서 document, window (0) | 2018.06.27 |
댓글