tsuzukihashi/stopwatch.html

## stopwatch.html
<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>ストップウォッチ</title>
    <script>
        window.onload = function () {
            var startButton = document.getElementById("start");
            var stopButton = document.getElementById("stop");
            var clearButton = document.getElementById("clear");
            var display = document.getElementById("display");
            var startTime, timer;

            startButton.onclick = start;
            function start() {
                startButton.onclick = null;
                clearButton.onclick = null;
                stopButton.onclick = stop;

                startTime = new Date();

                timer = setInterval(function () {
                    var now = new Date();
                    display.innerHTML = ((now - startTime) / 1000).toFixed(2);
                }, 10);
            }

            function stop() {
                clearInterval(timer);
                startButton.onclick = start;
                clearButton.onclick = clear;

            }

            function clear() {
                display.innerHTML = "0.00";
            }
        }
    </script>
</head>

<body>


    <div style="background-color: pink; text-align:center;font-size:250%;">
        <h1>ストップウォッチ</h1><p id="display">0.00</p>
        <input type="button" value="start" id="start">
        <input type="button" value="stop" id="stop">
        <input type="button" value="clear" id="clear">
    </div>
</body>

</html>
	<!DOCTYPE html>
	<html lang="ja">

	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>ストップウォッチ</title>
	<script>
	window.onload = function () {
	var startButton = document.getElementById("start");
	var stopButton = document.getElementById("stop");
	var clearButton = document.getElementById("clear");
	var display = document.getElementById("display");
	var startTime, timer;

	startButton.onclick = start;
	function start() {
	startButton.onclick = null;
	clearButton.onclick = null;
	stopButton.onclick = stop;

	startTime = new Date();

	timer = setInterval(function () {
	var now = new Date();
	display.innerHTML = ((now - startTime) / 1000).toFixed(2);
	}, 10);
	}

	function stop() {
	clearInterval(timer);
	startButton.onclick = start;
	clearButton.onclick = clear;

	}

	function clear() {
	display.innerHTML = "0.00";
	}
	}
	</script>
	</head>

	<body>


	<div style="background-color: pink; text-align:center;font-size:250%;">
	<h1>ストップウォッチ</h1><p id="display">0.00</p>
	<input type="button" value="start" id="start">
	<input type="button" value="stop" id="stop">
	<input type="button" value="clear" id="clear">
	</div>
	</body>

	</html>