距离年底还有多少天?前端猴子的自我警示

故事场景

在一个群里,每天有个群友发送一个图片,图片上写了:距离年底还有**天。感觉时间越来越近。是不是有点惶恐。不过感觉挺有用的。有时候想划划水。结果想到群友的图,就转而去码字了。前两天那位群友贴上了生成图片的 Excel 代码。但是当时我比较忙。今天闲下来了。于是就有了现在的 js 版本。效果如图:

clipboard.png
这样,每次调试代码,打开控制台,就能看到这么警示的时间提示。是不是可以创造一个紧张气氛。

制作流程

计算到年底多少天。首先要得到年底的日期。即:当前年数+12月31日。所以代码如下:

let lastDay = new Date().getFullYear()+'-12-31'

然后计算当年时间毫秒数与年底时间毫秒数之差,除以一天的毫秒数,就得到具体的天数:

let dayCalc = (new Date(lastDay).getTime()-Date.now())/1000/24/60/60

这里是小数,我们需要转化成整数。因为我们没有算上最后一天的时间,所以我们向上取整,来解决这个问题:

let day = Math.ceil(dayCalc)

然后是控制台打印:

console.log('%c距离年底还剩','font-size:24px;color:#666;')
console.log('%c'+day+'天','font-size:32px;color:#fff;background:#f00;')

最终得到方法如下:

function getDayLog(){
    let lastDay = new Date().getFullYear()+'-12-31'
    let dayCalc = (new Date(lastDay).getTime()-Date.now())/1000/24/60/60
    let day = Math.ceil(dayCalc)
    console.log('%c距离年底还剩','font-size:24px;color:#666;')
    console.log('%c'+day+'天','font-size:32px;color:#fff;background:#f00;')
}

为了让在每个页面上显示,我们用一个 chrome 插件:tampermonkey (https://chrome.google.com/web...
安装好之后,我们添加脚本:

clipboard.png
点击create a new script
然后,插入如下代码:

function getDayLog(){
    let lastDay = new Date().getFullYear()+'-12-31'
    let dayCalc = (new Date(lastDay).getTime()-Date.now())/1000/24/60/60
    let day = Math.ceil(dayCalc)
    console.log('%c距离年底还剩','font-size:24px;color:#666;')
    console.log('%c'+day+'天','font-size:32px;color:#fff;background:#f00;')
}
getDayLog()

记得确保match值是这样的:
// @match http://*/*

好了,至此,打开诸多页面开始调试都会看到这个警示了。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值