최신 웹 개발 튜토리얼
 

창문 setInterval() Method

<창 개체

경고 "Hello" 3 초마다 (3000 milliseconds) :

setInterval(function(){ alert("Hello"); }, 3000);
»그것을 자신을 시도

"Try it Yourself" 아래의 예.


정의 및 사용

setInterval() 메소드를 호출 함수 또는 지정된 간격 표현식을 평가한다 (in milliseconds) .

setInterval() 메소드 때까지 함수를 호출하는 것입니다 clearInterval() 호출하거나, 창이 닫힙니다.

에 의해 반환 된 ID 값 setInterval() 대한 매개 변수로서 사용된다 clearInterval() 방법.

Tip: 1000 MS = 일초.

팁 : 밀리 지정된 횟수, 사용 번만 기능을 실행 setTimeout() 메소드.


브라우저 지원

테이블의 숫자는 완전히 방법을 지원하는 최초의 브라우저 버전을 지정합니다.

방법
setInterval() 1.0 4.0 1.0 1.0 4.0

통사론

setInterval( function,milliseconds,param1,param2,... )

매개 변수 값

매개 변수 기술
function 필요합니다. 실행될 함수
milliseconds 필요합니다. 간격 (in milliseconds) 코드를 실행하는 방법에 자주에
param1,param2,... 선택 과목. 추가 매개 변수는 함수 (안 IE9에서 지원 및 이전 버전)에 전달할

기술적 세부 사항

반환 값 : 설정된 타이머의 ID 값을 나타내는 숫자. 으로이 값을 사용 clearInterval() 타이머를 취소하는 방법

예

더 예

또한 참조 할 수 있습니다 "named" 기능; 경고 "Hello" 3 초마다 (3000 milliseconds) :

var myVar;

function myFunction() {
    myVar = setInterval(alertFunc, 3000);
}

function alertFunc() {
    alert("Hello!");
}
»그것을 자신을 시도

현재 시간을 표시 (the setInterval() 메소드는 단지 디지털 시계와 같은 기능을 한 번에 1 초마다 실행됩니다)

var myVar = setInterval(function(){ myTimer() }, 1000);

function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("demo").innerHTML = t;
}
»그것을 자신을 시도

사용하기 clearInterval() 앞의 예에서 시간을 중지 :

var myVar = setInterval(function(){ myTimer() }, 1000);

function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("demo").innerHTML = t;
}

function myStopFunction() {
    clearInterval(myVar);
}
»그것을 자신을 시도

사용 setInterval()clearInterval() 동적 진행률 표시 줄을 만들 수 있습니다 :

function move() {
  var elem = document.getElementById("myBar");
  var width = 0;
  var id = setInterval(frame, 10);
  function frame() {
    if (width == 100) {
      clearInterval(id);
    } else {
      width++;
      elem.style.width = width + '%';
    }
  }
}
»그것을 자신을 시도

한 번에 두 개의 배경 색상마다 300 밀리 초 사이에 전환 :

var myVar = setInterval(function(){ setColor() }, 300);

function setColor() {
    var x = document.body;
    x.style.backgroundColor = x.style.backgroundColor == "yellow" ? "pink" : "yellow";
}

function stopColor() {
    clearInterval(myVar);
}
»그것을 자신을 시도

alertFunc 함수에 매개 변수 전달 (does not work in IE9 and earlier) :

var myVar;

function myStartFunction() {
    myVar = setInterval(alertFunc, 2000, "First param", "Second param");
}
»그것을 자신을 시도

익명 함수를 사용하는 경우, 그것은 모든 브라우저에서 작동합니다 :

var myVar;

function myStartFunction() {
    myVar = setInterval(function(){ alertFunc("First param", "Second param"); }, 2000);
}
»그것을 자신을 시도

관련 페이지

창 개체 : href="met_win_clearinterval.html"> clearInterval() Method

창 개체 : href="met_win_settimeout.html"> setTimeout() Method

창 개체 : href="met_win_cleartimeout.html"> clearTimeout() Method


<창 개체