Вопросы Теги

Поместите время внутри divs (Счетчик)

У меня есть счетчик, который я нашел на сайте, и он отлично работает, но я не могу поместить каждую переменную в тег.

также создают несколько div и с разными идентификаторами, но он удваивается с течением времени, а затем составляется список. 

if ($("body").hasClass("home")) {
                var end = new Date('11/22/2019 4:00 PM');

                var _second = 1000;
                var _minute = _second * 60;
                var _hour = _minute * 60;
                var _day = _hour * 24;
                var timer;

                function showRemaining() {
                    var now = new Date();
                    var distance = end - now;
                    if (distance < 0) {

                        clearInterval(timer);
                        document.getElementById('countdown').innerHTML = 'EXPIRED!';

                        return;
                    }
                    var days = Math.floor(distance / _day);
                    var hours = Math.floor((distance % _day) / _hour);
                    var minutes = Math.floor((distance % _hour) / _minute);
                    var seconds = Math.floor((distance % _minute) / _second);


                    document.getElementById('countdown').innerHTML = + '<p>' + days + '</p>';
                    document.getElementById('countdown').innerHTML += '<p>' + hours + '</p>';
                    document.getElementById('countdown').innerHTML += '<p>' + minutes + '</p>';
                    document.getElementById('countdown').innerHTML += '<p>' + seconds + '</p>';
                }

                timer = setInterval(showRemaining, 1000);
            }

Я тоже так пробовал, но он оставил несколько «р», и идея состоит в том, чтобы держать его в одной метке, то есть, без дублирования 

$('#countdown').append('<p>' + seconds + '</p>');

здесь наступает регрессивное время 

<div id="countdown"></div>
0
задан 22.11.2019, 21:19
1 ответ

"use strict"

$(document).ready(function(){
        var end = new Date('11/30/2019 4:00 PM');

        var _second = 1000;
        var _minute = _second * 60;
        var _hour = _minute * 60;
        var _day = _hour * 24;
        var timer;

        function showRemaining() {
            var now = new Date();
            var distance = end - now;
            if (distance < 0) {

                clearInterval(timer);
                document.getElementById('countdown').innerHTML = 'EXPIRED!';

                return;
            }
            var days = Math.floor(distance / _day);
            var hours = Math.floor((distance % _day) / _hour);
            var minutes = Math.floor((distance % _hour) / _minute);
            var seconds = Math.floor((distance % _minute) / _second);

            $('#dias').html('<p>' + days + '</p>');
            $('#horas').html('<p>' + hours + '</p>');
            $('#minutos').html('<p>' + minutes + '</p>');
            $('#segundos').html('<p>' + seconds + '</p>');
        }

        timer = setInterval(showRemaining, 1000);

});
<!DOCTYPE html>
<html>
    <head>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"
            integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
            crossorigin="anonymous"></script>
        <script src="./index.js"></script>
    </head>
    <body>
        <div id="dias" ></div>
        <div id="horas" ></div>
        <div id="minutos" ></div>
        <div id="segundos"></div>      
    </body>
</html>
0
ответ дан 01.12.2019, 10:56