先导
写这篇帖子的原因是我很想在博客网站下面添加网站的运行时间,网上虽然有教程是怎么添加的,但是他们演示的主题大都是用ejs
或者是wig
来编写的,而我使用的这个个人很喜欢的stun
主题却是用pugjs
编写的,实在是很想用,所以根据语法的转换规则修改了一份pug
文件下添加的脚本来使用,美滋滋
脚本
原来的ejs
脚本
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
| <div> <span id="timeDate">载入天数...</span><span id="times">载入时分秒...</span> <script> var now = new Date(); function createtime() { var grt= new Date("08/13/2018 00:00:00"); now.setTime(now.getTime()+250); days = (now - grt ) / 1000 / 60 / 60 / 24; dnum = Math.floor(days); hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum); hnum = Math.floor(hours); if(String(hnum).length ==1 ){hnum = "0" + hnum;} minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum); mnum = Math.floor(minutes); if(String(mnum).length ==1 ){mnum = "0" + mnum;} seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum); snum = Math.round(seconds); if(String(snum).length ==1 ){snum = "0" + snum;} document.getElementById("timeDate").innerHTML = "本站已安全运行 "+dnum+" 天 "; document.getElementById("times").innerHTML = hnum + " 小时 " + mnum + " 分 " + snum + " 秒"; } setInterval("createtime()",250); </script> </div>
|
转换后的pugjs
脚本
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
| div span#timeDate 载入天数... span#times 载入时分秒... script. var now = new Date(); function createtime() { var grt= new Date("08/13/2018 00:00:00"); now.setTime(now.getTime()+250); days = (now - grt ) / 1000 / 60 / 60 / 24; dnum = Math.floor(days); hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum); hnum = Math.floor(hours); if(String(hnum).length ==1 ){hnum = "0" + hnum;} minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum); mnum = Math.floor(minutes); if(String(mnum).length ==1 ){mnum = "0" + mnum;} seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum); snum = Math.round(seconds); if(String(snum).length ==1 ){snum = "0" + snum;} document.getElementById("timeDate").innerHTML = "本站已安全运行 "+dnum+" 天 "; document.getElementById("times").innerHTML = hnum + " 小时 " + mnum + " 分 " + snum + " 秒"; } setInterval("createtime()",250);
|
然后把上述脚本添加到主题的layout/_partials/footer/footer.pug
文件中(不同主题可能文件不一样,请自行参考)即可在网页底部显示网站运行时间了OvO
,不过要注意修改一下var grt= new Date("08/13/2018 00:00:00");
中的起始时间哦!
后记
后来发现了一个神奇的网站可以帮助从html
转到pug
,请戳这里,难受,虽然上面的不难翻译,但是用这个网站不费力是真的…
impressionyang