HTML

<div>
    <button type="button" onclick="start_timer()">시작</button>
    <button type="button" onclick="stop_timer()">종료</button>
</div>
<p class="counter">10</p>

<!--javascript-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

JAVASCRIPT

var setimeout_var;
var count = 10;

function timer(){
  if(count <= 0){
    clearTimeout(setimeout_var);
    clearTimeout(setimeout_var);
    clearTimeout(setimeout_var);
  }else{
    count = count - 1;
    $('.counter').text(count);
    setimeout_var = setTimeout(timer, 1000);
  }

}

function start_timer(){
  setTimeout(timer, 1000);
}

function stop_timer(){
  clearTimeout(setimeout_var);
  clearTimeout(setimeout_var);
  clearTimeout(setimeout_var);
  count = 10;
  $('.counter').text('10');
}

REFERENCE

  1. 내용 설명
    • 1초 마다 10부터 0까지 숫자 감소