3.1 타이머 함수

일정한 시간마다 특정 구문을 실행하고자 할 때 사용하는 기능

 

-setInterval()

일정 시간마다 주기적으로 특정 구문을 실행하는 기능

-setTimeout()

일정 시간이 지난 후 특정 구문을 딱 한번 실행하는 기능

-clearInterval()

실행 중인 타이머 함수를 멈추는 기능

 

-일정 시간마다 특정 구문을 실행하는 타이머 만들기

-일정 시간이 지난 후 딱 한 번 실행되는 타이머 만들기

-타이머 멈추기

 

-일정 시간마다 특정 구문을 실행하는 타이머 만들기

var timerID = setInterval(func, duration); 

-func 지연 시간마다 타이머 함수에 의해 호출되는 일종의 콜백함수

-duration 지연시간, 단위는 밀리초

///////////////1초에 한 번씩 변숫값을 1씩 증가시키고 이 값을 #output영역에 출력////////////

$(document).ready(function(){

  var $output = $("#output");

  var count = 0;

 

setInterval(function(){

    //값증가

    count++;

    //값 출력

    $output.text(count);

  },1000)

})

///////////////////////////////////////////////////////////////////////////////////////////////

-일정 시간이 지난 후 딱 한 번 실행되는 타이머 만들기

var timerId = setTimeout(func,duration);

 

////////////////////////3초후에 메시지 띄우기//////////////////////////////////

$(document).ready(function(){

    var $output = $("#output");

    

  setTimeout(function(){

    $output.text("안녕하세요, 미스터 로즈입니다.")

} , 3000)

})

//////////////////////////////////////////////////////////////////////////////////////////

타이머 멈추기

claerInterval(timeID);

timeID 제거할 타이머 ID

 

////////////////////1초에 한번씩 숫자 값 출력 정지 버튼///////////////////////////

$(document).ready(function(){

  var $output = $("#output");

  var count = 0;

 

  setInterval(function(){

    //값 증가

    count++;

    // 값을 출력

    $output.text(count);

},1000)

 

$("#stop).click(function(){

 

  clearInterval(timerID);

  })

})