原生JS实现倒计时和整点秒杀(详解)

前言:在电商平台我们经常能看到整点秒杀或者是倒计时秒杀,如何用原生的JS代码来实现这样的功能呢?

1.整点秒杀:

思路分析:(h,m,s)

• 获取当前的时分秒 new Date()
• s++
• 如果 s > 59,s = 0, m++
• m > 59,m = 0, h++
• 如果hms < 10 ，前面加上0
• 计算好时分秒赋值给页面的文本
• 如果 h = 20 && m = 0 && s == 0 则清除定时器(因为我默认设为20:00:00)

---

代码如下:

    
    



    
    

     20:00:00结束

    

2.倒计时秒杀:

• 获取元素
• 获取当前的时分秒
• s--
• 如果s < 0, s = 59, m--
• 如果m < 0, m = 59, h--
• 如果 m h s < 10,需要在前面加上0
• 将计算好的时分秒赋值给页面元素的文本
• 如果 h == 0 && m == 0 && s == 0,清除定时器

---

代码如下

    
    
    
    



    01:
    03:
    06

    

总结:倒计时和整点秒杀实现的逻辑略有不同,不过代码是比较相似的,欢迎各位大佬指正.