JavaScript

Помогите пожалуйста ничего не понимаю

(Нужно написать исключительно на JavaScript)
Напишите реализацию таймера.
Шаг анимация таймера 1 секунда
Форматирование таймера "hh:mm:ss".
Например 01:12:59 - один час, 12 минут, 59 секунд.
РГ
Руслан Гарифуллин
116 
  

 

  

      

    Document  

      

        .timer { font-size: 30px; } 

        .start { width: 132px; height: 42px; } 

     

     

        let clock = { 

            time: [0, 0, 0], 

            split: function (str) { 

                time = str.split(':'); 

                time = time.map(str => parseInt(str)); 

            }, 

            decriment: function() { 

                if (time[2] > 0) --time[2]; 

                else { 

                    if (time[1] > 0) { 

                        --time[1]; 

                        time[2] = 59; 

                    } 

                    else { 

                        if (time[0] > 0) { 

                            --time[0]; 

                            time[1] = time[2] = 59; 

                        } 

                    } 

                } 

            }, 

            to_string: function() { 

                let ts = ""; 

                if (time[0] < 10) { 

                    ts += "0"; 

                } 

                ts += time[0] + ":"; 

                if (time[1] < 10) { 

                    ts += "0"; 

                } 

                ts += time[1] + ":"; 

                if (time[2] < 10) { 

                    ts += "0"; 

                } 

                ts += time[2]; 

                return ts; 

            }, 

            is_end_time: function() { 

                return 0 == time[0] + time[1] + time[2]; 

            } 

        }; 

        function main() { 

            let timer = document.querySelector('.timer'); 

            let start = document.querySelector('.start'); 

            start.addEventListener('click', function() { 

                start.hidden = true; 

                let interval = setInterval(() => { 

                    clock.split(timer.value); 

                    clock.decriment(); 

                    timer.value = clock.to_string(); 

                    if (clock.is_end_time()) { 

                        clearInterval(interval); 

                    } 

                }, 1000); 

            }); 

        } 

        document.addEventListener('DOMContentLoaded', main);
Алексей С
Алексей С
92 713
Лучший ответ
https://codepen.io/norbert123/pen/NWEOLzg может как то так
Роман Стружкин
Роман Стружкин
59 846
Ну вот я делал таймер (с минутами и секундами, с отображением часов возиться не захотелось). Тикают секундочки и минуточки. Правда знатоками был поднят крик что мол setInterval не дает абсолютно точный отрезок времени и такой таймер будет накоплять погрешность. Но минуты и секунды тикают, ради теоретического интереса уже успех
  

 

 

     

    Document 

 

    span {font-size: 40px; font-family: Verdana; color: darkblue  } 

 

 

 

00: 

00 

 

    let start = false; 

    let sec1 = 0; sec2 = 0; min1 = 0; min2 = 0; 

    function timer () { 

        sec2++; start = true; 

        if (sec2 == 10) {sec1++; sec2 = 0;} 

        if (sec1 == 6) {sec1 = 0} 

        if (sec1 == 0 && sec2 == 0 && start) {min2++} 

        if (min2 == 10) { min2 = 0; min1++;} 

        if (min1 == 6) {min1 = 0} 

        second1.innerHTML = sec1; 

        second2.innerHTML = sec2; 

        minutes2.innerHTML = min2; 

        minutes1.innerHTML = min1; 

    } 

    let timerId = setInterval(timer, 1000);
Королёв Геннадий
Королёв Геннадий
5 840
Леонид Дмитревский setInterval дает погрешность, а какие есть варианты максимально точно время показывать?
Станислав Попов Так ты поинтересуйся у знатоков, как "правильно" решить эту проблему. Мне реально интересно как в принципе реализовать часы без setInterval и setTimeout. Это единственные методы для подсчёта времени, на сколько мне известно.

Похожие вопросы