带有设置时间的javascript倒计时器

我正在尝试为一个网站创建一个24小时的销售时间。 我已经知道了如何使用从午夜开始的每日计时器来计算当前时间，但是我需要更灵活地使用它，并且能够在一天中的任意时间开始计时。 我目前得到的代码是：

  <div id="countdown_hours"></div>
  <script>
  setInterval(function time(){
  var d = new Date();
  var hours = 24 - d.getHours();
  var minutes = 60 - d.getMinutes();
  if((minutes + '').length == 1){
    minutes = '0' + minutes;
  }
  var seconds = 60 - d.getSeconds();
  if((seconds + '').length == 1){
        seconds = '0' + seconds;
  }
  document.getElementById("countdown_hours").innerHTML =
             '<div class="clockcontainer">'
              + '<p>Promo</p>'
              + '<div class="clock">'
              + '<div class="count"><span>'
              + hours
              + '</span> <label> Hours</label> </div>'
              + '<div class="count"><span>'
              + minutes
              + '</span> <label> Minutes</label> </div>'
              + '<div class="count"><span>'
              + seconds
              +'</span> <label> Seconds</label> </div>'
              + '</div>'
              + '</div>';
}, 1000);
  </script>

setInterval（函数时间（）{
var d=新日期（）；
var hours=24-d.getHours（）；
var minutes=60-d.getMinutes（）；
如果（（分钟+“”）。长度==1）{
分钟='0'+分钟；
}
var seconds=60-d.getSeconds（）；
如果（（秒+“”）。长度==1）{
秒='0'+秒；
}
document.getElementById（“倒计时小时”）.innerHTML=
''
+“Promo
”
+ ''
+ ''
+小时数
+“小时”
+ ''
+会议记录
+“分钟”
+ ''
+秒
+“秒”
+ ''
+ '';
}, 1000);

因此，我想我需要设置一个变量到倒计时时间，例如

var time=24

，然后从这个var时间开始倒计时，以小时、分钟和秒为单位。有人能告诉我如何实现这一目标的正确方向吗？

你可以使用

---

你可以这样做：

// A countdown object
const CountDown = function (target) {
    const endTime = new Date(target);

    // Return a date object with the time left
    this.getTime = () => new Date(endTime - Date.now());
}

// This simply a method of setting the date to 24 hours
// See https://stackoverflow.com/a/3674550/3533202
const tomorrow = new Date();
tomorrow.setDate(
    new Date().getDate() + 1
);

// Initialise the countdown object
const countdown = new CountDown(tomorrow);

// Get the element you want to change
const elem = document.getElementById("countdown_hours");

setInterval(function (elem) {
    const timeLeft = countdown.getTime();

    // Get the time left in numerical format
    const hours = timeLeft.getHours();
    const minutes = timeLeft.getMinutes();
    const seconds = timeLeft.getSeconds();

    // Now populate your element
    // This is a template literal, see:
    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
    console.log(`
    <div class="clockcontainer">
        <p>Promo</p>
        <div class="clock">
            <div class="count">
                <span>${hours}</span>
                <label> Hours</label>
            </div>
            <div class="count">
                <span>${minutes}</span>
                <label> Minutes</label>
            </div>
            <div class="count">
                <span>${seconds}</span>
                <label> Seconds</label>
            </div>
        </div>
    </div>`)
}, 1000, elem)

//倒计时对象
常量倒计时=函数（目标）{
const endTime=新日期（目标）；
//返回剩余时间的日期对象
this.getTime=（）=>newdate（endTime-Date.now（））；
}
//这只是一种将日期设置为24小时的方法
//看https://stackoverflow.com/a/3674550/3533202
const明天=新日期（）；
明天，设定日期(
新日期（）.getDate（）+1
);
//初始化倒计时对象
const倒计时=新倒计时（明天）；
//获取要更改的元素
const elem=document.getElementById（“倒计时小时”）；
设置间隔（函数（元素）{
const timeLeft=countdown.getTime（）；
//以数字格式获取剩余时间
const hours=timeLeft.getHours（）；
const minutes=timeLeft.getMinutes（）；
const seconds=timeLeft.getSeconds（）；
//现在填充您的元素
//这是一个模板文本，请参见：
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
console.log(`
宣传片

${hours}
小时
${minutes}
会议记录
${seconds}
秒
`)
}，1000，elem）

您可以按某个特定类标记所有的倒计时，并在数据属性中传递倒计时的unix时间戳

我强烈建议在javascript中使用库进行时间操作（它有丰富的API，它构建在默认日期类之上以实现兼容性，几乎在任何地方都可以工作，并且支持文本本地化）

简单的例子：

功能倒计时（el，间隔）{
const end=moment.unix（el.dataset.end）；
const dur=力矩持续时间（end.diff（力矩（））；
让html=''
如果（dur.hours（）>0）{
常数小时=数学楼层（实际时间）；
html+=hours+''+复数形式（hours，'hour'+'，'；
}
如果（dur.minutes（）>0）{
html+=dur.minutes（）+''+复数形式（dur.minutes（），'minute'）+，'；
}
如果（dur.seconds（）>0）{
html+=dur.seconds（）+“”+复数（dur.seconds（），'second'）+，'；
}
html=html.slice（0，-2）；
如果（dur
// A countdown object
const CountDown = function (target) {
    const endTime = new Date(target);

    // Return a date object with the time left
    this.getTime = () => new Date(endTime - Date.now());
}

// This simply a method of setting the date to 24 hours
// See https://stackoverflow.com/a/3674550/3533202
const tomorrow = new Date();
tomorrow.setDate(
    new Date().getDate() + 1
);

// Initialise the countdown object
const countdown = new CountDown(tomorrow);

// Get the element you want to change
const elem = document.getElementById("countdown_hours");

setInterval(function (elem) {
    const timeLeft = countdown.getTime();

    // Get the time left in numerical format
    const hours = timeLeft.getHours();
    const minutes = timeLeft.getMinutes();
    const seconds = timeLeft.getSeconds();

    // Now populate your element
    // This is a template literal, see:
    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
    console.log(`
    <div class="clockcontainer">
        <p>Promo</p>
        <div class="clock">
            <div class="count">
                <span>${hours}</span>
                <label> Hours</label>
            </div>
            <div class="count">
                <span>${minutes}</span>
                <label> Minutes</label>
            </div>
            <div class="count">
                <span>${seconds}</span>
                <label> Seconds</label>
            </div>
        </div>
    </div>`)
}, 1000, elem)