目录

倒计时

1 Date()对象

var myDate=new Date()

Date 对象会自动把当前日期和时间保存为其初始值。

2 getTime()函数

2.1 定义和用法

getTime() 方法可返回距 1970 年 1 月 1 日之间的毫秒数。

2.2 语法

dateObject.getTime()

2.3 返回值

dateObject 指定的日期和时间距 1970 年 1 月 1 日午夜(GMT 时间)之间的毫秒数。

该方法总是结合一个 Date 对象来使用。

2.4 例子

在本例中,我们将取得从 1970/01/01 至今的毫秒数,并输出它:

<script type="text/javascript">

var d = new Date()
document.write(d.getTime() + " milliseconds since 1970/01/01")

//1468916791243 milliseconds since 1970/01/01

</script>

3 setTime()

3.1 定义和用法

setTime() 方法以毫秒设置 Date 对象。

3.2 语法

dateObject.setTime(millisec)

millisec:要设置的日期和时间据 GMT 时间 1970 年 1 月 1 日午夜之间的毫秒数。这种类型的毫秒值可以传递给 Date() 构造函数,可以通过调用 Date.UTC() 和 Date.parse() 方法获得该值。以毫秒形式表示日期可以使它独立于时区。

3.3 返回值

返回参数 millisec。在 ECMAScript 标准化之前,该方法不返回值。

该方法总是结合一个 Date 对象来使用。

3.4 例子

在本例中,我们将向 1970/01/01 添加 77771564221 毫秒,并显示新的日期和时间:

<script type="text/javascript">

var d = new Date()
d.setTime(77771564221)
document.write(d)

//Mon Jun 19 1972 11:12:44 GMT+0800 (CST)
</script>

4 时间与毫秒数互相转换

4.1 日期时间转换成毫秒时间

var time = (new Date("2016/07/19 16:38:04")).getTime(); //得到毫秒数  

//1468917484000

若时间为其他格式,最好转换为统一格式:2016/07/19 16:38:04 再进行毫秒转换。如果不使用统一格式,在微信中会出错。

例:

var oldTime = '2016-07-19 16:38:04';
var newTime = oldTime.replace(new RegExp("-","gm"),"/");
var time = (new Date(newTime)).getTime(); //得到毫秒数

//1468917484000

4.2 毫秒数时间转化为日期时间

var oldTime = 1468917484000;
var newTime = new Date(oldTime); //就得到普通的时间了 

//Tue Jul 19 2016 16:38:04 GMT+0800 (CST)

5 倒计时Demo

js文件(countdown.js)

function countdown(endTime,callback){

    function fomtime()
    {
        var systemTime=new Date();
        var overTime=new Date();
        overTime.setTime(endTime);

        var difftime = parseInt((overTime.valueOf() - systemTime.valueOf())/1000);

        if( difftime <= 0 ){
            callback && callback();
            return;
        }

        var day = parseInt(difftime / (60*60*24));
        var dayRemainder = difftime % (60*60*24);
        var hours = parseInt(dayRemainder / (60*60));
        var hoursRemainder = dayRemainder % (60*60);
        var minu = parseInt(hoursRemainder / 60);
        var seco = hoursRemainder % 60;

        callback && callback({
            day: day < 10 ? '0'+day : day,
            hours: hours < 10 ? '0'+hours : hours,
            minu: minu < 10 ? '0'+minu : minu,
            seco: seco < 10 ? '0'+seco : seco
        });

        setTimeout(function(){
            fomtime()
        },1000);
        
    }
    fomtime();
}

html文件(index.html)

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>倒计时</title>
</head>
<body>
<div style='margin-top:300px;margin-left:300px'>
    倒计时:
    <span id='day'></span>天
    <span id='hours'></span>小时
    <span id='minu'></span>分
    <span id='seco'></span>秒
</div>
<script type="text/javascript" src='countdown.js'>
<script type="text/javascript">

    var time='2016-7-21 13:34:35';         //以毫秒为单位

    time = time.replace(new RegExp("-","gm"),"/");
    time = (new Date(time)).getTime();

    countdown(time,callback);

    function callback(time){
        if( !time ){
            document.getElementById('day').innerHTML='00';
            document.getElementById('hours').innerHTML='00';
            document.getElementById('minu').innerHTML='00';
            document.getElementById('seco').innerHTML='00';
        }else{
            document.getElementById('day').innerHTML= time.day;
            document.getElementById('hours').innerHTML=time.hours;
            document.getElementById('minu').innerHTML=time.minu;
            document.getElementById('seco').innerHTML=time.seco;
        }
    }
</script>
</body>
</html>
Loading Disqus comments...