<span id="h">00</span> : <span id="m">00</span> : <span id="s">00</span>
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/locale/ru.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment-duration-format/2.2.2/moment-duration-format.min.js"></script> </head> <body> <div><span id="h">01</span> : <span id="m">15</span> : <span id="s">45</span></div> <script> moment.locale('ru'); var DateEnd = moment(); var span = document.querySelectorAll('div span'); [].forEach.call(span, function(el) { DateEnd.add(+el.textContent, el.id) }); function fn() { var DateTime = moment(); var d = DateEnd - DateTime; document.querySelector("div").innerHTML = moment.duration(d).format('[<span id="h">]hh[</span> : <span id="m">]mm[</span> : <span id="s">]ss[</span>]'); d > 0 && window.setTimeout(fn, 300) } fn() </script> </body> </html>
