taquaki-satwo
11/27/2017 - 11:54 AM

ストップウォッチ

ストップウォッチ

window.onload = () => {
  const startButton = document.getElementById('start');
  const stopButton = document.getElementById('stop');
  const clearButton = document.getElementById('clear');
  const display = document.getElementById('display');
  let startTime, timer;
  startButton.onclick = start;
  clearButton.onclick = clear;
  
  function start() {
    startButton.onclick = null;
    stopButton.onclick = stop;
    clearButton.setAttribute('disabled', 'true');

    startTime = new Date();
    timer = setInterval(() => {
      const now = new Date();
      display.innerHTML = ((now - startTime)/1000).toFixed(2);
    }, 10);
  }
  
  function stop() {
    clearInterval(timer);
    startButton.onclick = start;
    clearButton.removeAttribute('disabled');
  }
  
  function clear() {
    display.innerHTML= '0.00'
  }
}

#display 0.00
input#start(type='button' value='start')
input#stop(type='button' value='stop')
input#clear(type='button' value='clear')

ストップウォッチ

A Pen by Takaaki Sato on CodePen.

License.