setInterval / clearInterval

*setInterval (정한 시간마다 실행)

// 시작 버튼을 만들어준다.
<button onclick="start()">Interval Start</button>



function func() {
    alert('hi :)');
}

function start() {
    setInterval(func, 3000);
}


결과
Interval Start 버튼을 누르면 3000(3초) 마다 경고창이 뜬다.

• setInterval을 쓰면 경고창이 나오는데 경고창을 누르지 않아도 계속 쌓인다.
• 그래서 이를 멈춰주기 위해 clearInterval을 사용.

 

*clearInterval

// End 버튼을 하나 더 만들어줌.
<button onclick="start()">Interval Start</button>
<button onclick="end()">Interval End</button>



var info = 0;

function func() {
    alert('hi :)');
}

function start() {
    info = setInterval(func, 3000);
}

function end() {
    clearInterval(info);
}



설명0
clearInterval을 쓰기 전에 setInterval에 이름을 지정해줘야 한다.
var info = 0; 라는 변수를 주고 여기에 setInterval을 담는다.
info = setInterval(func, 3000);

그리고 clearInterval(이름) <---- 여기에 info 를 넣어줌
clearInterval(info);