javascript倒计时器的知识点+案例

近期用过的一些小知识点概览。

知识点

javascript调用日期相关的对象:

Date() -- 返回当前的日期和时间
getFullYear() -- 返回完整格式的年份(2016)
getYear() -- 返回年份
getMonth() -- 返回月份值(从0开始计算,递增+1)
getDate() -- 查看Date对象并返回日期,格式(1-31)
getDay() -- 返回星期几(0-6)
getHours() -- 返回小时数(0-23)
getMinutes() -- 返回分钟数(0-59)
getSeconds() -- 返回秒数
getTime() -- 返回毫秒数

javascript数值处理函数:

Math.ceil();向上取整
parseInt(); 取整,舍去小数点后的内容
% 取余

使用方法:

var myDate = new Date();
//年月日
var year = myDate.getFullYear();
var month = myDate.getMonth()+1;
var date = myDate.getDate();
//星期
var weekday = new Array(7);
    weekday[0]="星期日";
    weekday[1]="星期一";
    weekday[2]="星期二";
    weekday[3]="星期三";
    weekday[4]="星期四";
    weekday[5]="星期五";
    weekday[6]="星期六";
var week = weekday[myDate.getDay()];
//时分秒
var H = myDate.getHours();
var M = myDate.getMinutes();
var S = myDate.getSeconds();
var tt = myDate.getTime();

时间效果实现

考试倒计时

//做一个指定结束日期的倒计时器,用`new Date()`新建日期,
//开始日期和结束日期对象:
var curTime=new Date();
var endTime=new Date("2016,6,6");
//剩余时间/时间差即为:
var leftTime=curTime-endTime;
//再将时间差进行天数折算,一天24小时,一小时60分钟,一分钟60秒,一秒1000毫秒,那么,相差的天数为:
leftTime = leftTime/(24*60*60*1000);
//再将数值取整,得到倒计时天数:
leftTime = Math.ceil(leftTime);

活动倒计时:

function countDay(){
var nowtime = new Date();
var endtime = new Date("2016/6/1,11:11:11");//结束时间
var lefttime = parseInt((endtime.getTime()-nowtime.getTime())/1000);//换算为毫秒差,及最小单位的差值
if (lefttime<0) {
    document.getElementById('leftTime').innerHTML = "活动已结束";
    clearInterval(timer);
}else{
    var d = parseInt(lefttime/(24*60*60));
    var h = parseInt(lefttime/(60*60)%24);
    var m = parseInt(lefttime/60%60);
    var s = parseInt(lefttime%60);
    document.getElementById('leftTime').innerHTML = " "+d+"天"+h+"小时"+m+"分钟"+s+"秒";
}
}
countDay();
var timer = setInterval('countDay()',500);

以上,实现javascript计时器效果。

NOOLDEY

本文作者:NOOLDEY

做一个诗情画意的码农,皮皮猪,我们走!

原文链接: http://zhuweisheng.com.cn/html/js-date-counter/

本站文章如无特殊声明均为原创,创作不易,转载请注明来源,谢谢!