<div class="container">
<h1>Секундомер</h1>
<p id="circleLab"></p>
<p id="time">0</p>
<button id="start" class="btn">Старт</button>
<button id="stop" class="btn">Стоп</button>
<button id="reset" class="btn">Сброс</button>
<button id="circle">Круг</button>
</div>
<script>
const time = document.querySelector("#time");
const start = document.querySelector("#start");
const stop = document.querySelector("#stop");
const reset = document.querySelector("#reset");
const circle = document.querySelector("#circle");
const p = document.querySelector("circleLab");
let currentTime = 0;
time.innerHTML = currentTime;
let intervalId;
start.addEventListener("click", () => {
intervalId = setInterval(() => {
currentTime += 0.01;
start.innerText = "Продолжить";
time.innerHTML = currentTime.toFixed(2);
}, 10);
});
stop.addEventListener("click", () => {
clearInterval(intervalId);
});
circle.addEventListener("click", () => {
let newCircle = document.createElement("p");
newCircle.innerHTML = currentTime.toFixed(4);
document.body.insertBefore(newCircle, p);
});
reset.addEventListener("click", () => {
clearInterval(intervalId);
currentTime = 0;
time.innerHTML = 0;
start.innerHTML = "Старт"
});