dateMaker.js

这是about页面中用到的一个js程序,可以根据一个起始日期计算距离当前的差值,精确到毫秒。

程序本体:由一个dateMaker获取数据函数和一个time_valide日期格式化函数组成

function dateMaker(id) {
    var dom = document.querySelector('#'+id);
    // 计时器间隔
    var interval_time = dom.getAttribute('interval-time') !== null ? parseInt(dom.getAttribute('interval-time')) : 1000;
    // 额外添加的时间,逗号隔开
    var plus_time = 0;
    var plus_time_attr = dom.getAttribute('plus-time');
    var plus_time_arr = /^(\d+,)+\d+$/.test(plus_time_attr) ? plus_time_attr.split(',') : false;
    if(plus_time_arr) {
        plus_time_arr.forEach(function(v, k) {
            plus_time += parseInt(v);
        });
    } else if(/^\d+$/.test(plus_time_attr)) {
        plus_time = parseInt(plus_time_attr);
    }

    // 开始时间 字符串 比如 2019/09/11 16:42:00
    var sTime = new Date(dom.getAttribute('start-time')).getTime();

    var timer = setInterval(function() {
        var now = new Date();
        t = time_valide(sTime - plus_time, now.getTime());
        var years = t.y > 0 ? t.y + '年' : '';
        var months = t.m > 0 ? t.m + '个月' : t.y > 0 ? '1个月' : '';
        var days = t.d > 0 ? t.d + '天' : t.y > 0 ? '1天' : '';
        var hours = t.h;
        if(hours < 10) hours = '0' + hours;
        hours += '个小时';
        var mins = t.i;
        if(mins < 10) mins = '0' + mins;
        mins += '分钟';
        var secs = t.s;
        if(secs < 10) secs = '0' + secs;
        secs += '秒';
        var msecs = now.getMilliseconds();
        if(msecs < 10) {
            msecs = '00' + msecs + '毫秒';
        } else if(msecs >= 10 && msecs < 100) {
            msecs = '0' + msecs + '毫秒';
        } else {
            msecs += '毫秒';
        }
        dom.innerHTML = years + months + days + hours + mins + secs + msecs;
    }, interval_time);
}

function time_valide(starttime, endtime) {
    var timediff = endtime / 1000 - starttime / 1000;
    // 年
    var years = parseInt(timediff / 31536000);
    var remain = timediff % 31536000;
    // 月
    var months = parseInt(remain / 2592000);
    remain %= 2592000;
    // 日
    var days = parseInt(remain/86400);
    remain = remain%86400;
    // 时
    var hours = parseInt(remain/3600);
    remain = remain%3600;
    // 分
    var mins = parseInt(remain/60);
    remain = remain%60;
    // 秒
    var secs = parseInt(remain%60);

    return {
        y: years,
        m: months,
        d: days,
        h: hours,
        i: mins,
        s: secs
    }
}

使用时引入dateMaker.js,使用dateMaker并传入一个ID


支持几个属性

  • plus-time:额外增加的时间,单位毫秒,比如我统计工作时间,我是从2018年10月到现在在工作,并且2015年也工作了9个多月,所以我这里写“23241600000”,也就是额外增加的时间,可以添加多个,用英文逗号隔开
  • start-time:这个不用多说,就是开始时间,年月日格式必须用斜杠“yyyy/mm/dd”,不能用减号“yyyy-mm-dd”,否则苹果手机的浏览器可能不兼容,包括苹果手机的QQ、微信内置浏览器
  • interval-time:这是计时器的间隔时间,单位毫秒,每过多长时间运行一次,如果时间精确到秒的话写1000就OK,精确到毫秒的话得有那种飞快跑动的感觉,所以这里是50

最后会在这个span标签内生成“X年X个月X天XX个小时XX分钟XX秒XXX毫秒