好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

js实现简单的倒计时

本文实例为大家分享了js实现简单倒计时的具体代码,供大家参考,具体内容如下

代码:

?

<!DOCTYPE html>

< html lang = "en" >

 

< head >

   < meta charset = "UTF-8" >

   < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >

   < title >Document</ title >

   < script src = "./3.小于10补零封装.js" ></ script >

   < style >

     div {

       float: left;

       width: 100px;

       height: 100px;

       background-color: #000;

       text-align: center;

       line-height: 100px;

       color: #fff;

       font-size: 30px;

       margin-right: 10px;

     }

   </ style >

</ head >

 

< body >

   < div ></ div >

   < div ></ div >

   < div ></ div >

   < div ></ div >

   < script >

     var div = document.getElementsByTagName('div');

     var inputTime = +new Date('2021-02-05 0'); //用户输入时间距离1970年1月1日 总毫秒数

     setInterval(countTime, 1000);

     countTime();

 

     function countTime() {

       var nowTime = +new Date(); //当前时间距离1970年1月1日 总毫秒数

       // console.log(timer);

       var times = (inputTime - nowTime) / 1000; //秒

       var d = parseInt(times / 60 / 60 / 24); //天

       div[0].innerHTML = addZero(d) + '天';

       var h = parseInt(times / 60 / 60 % 24) //时

       div[1].innerHTML = addZero(h) + '时';

       var m = parseInt(times / 60 % 60); //分

       div[2].innerHTML = addZero(m) + '分';

       var s = parseInt(times % 60); //秒

       div[3].innerHTML = addZero(s) + '秒';

 

 

     }

   </ script >

</ body >

 

</ html >

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。

原文链接:https://blog.csdn.net/are_gh/article/details/112722518

查看更多关于js实现简单的倒计时的详细内容...

  阅读:43次