script.js

const num = document.querySelector("#num");
const ssbtn = document.querySelector("#ssbtn");
const rebtn = document.querySelector("#rebtn");

let hours = 0;
let minutes = 0;
let seconds = 0;
let count = 0;

num.textContent =  `${String(hours)}:${String(minutes).padStart(2, '0')}:${String(seconds)}:${String(count).padStart(2, '0')}`;

const shoWTime = () => {

    count++;

    if (count == 10) {
        seconds++;
        count = 0;
    }

    if (seconds == 60) {
        minutes++;
        seconds = 0;
    }

    if (minutes == 60) {
        hours++;
        minutes = 0;
    }

    num.textContent = `${String(hours)}:${String(minutes).padStart(2, '0')}:${String(seconds)}:${String(count).padStart(2, '0')}`;
};

let interval;
let running = false;

ssbtn.addEventListener("click", function () {

    if (!running) {
        ssbtn.textContent = "Stop";
        running = true;

        interval = setInterval(shoWTime, 100);

    } else {
        ssbtn.textContent = "Start";
        running = false;
        clearInterval(interval);
    }

});


rebtn.addEventListener("click", () => {
    clearInterval(interval);

    hours = 0;
    minutes = 0;
    seconds = 0;
    count = 0;

    num.textContent = `${String(hours)}:${String(minutes).padStart(2, '0')}:${String(seconds)}:${String(count).padStart(2, '0')}`;

    ssbtn.textContent = "Start";
    running = false;
});