在网站底部增加运行时长显示

本文最后更新于:2021年11月18日 晚上

正文

在网站对应位置添加以下代码(本站在 footer 下增加),代码中包含两个标签:

  • span :用来显示文本的标签

  • **script **:用来运行计时的脚本

展示代码

<span id="website_runtime"></span>
<script type="text/javascript">
function show_runtime(){
    // 定时器
    window.setTimeout("show_runtime()", 1000);
    // 开始时间
    let start = new Date("2019/02/08 00:00:00");
    // 当前时间
    let now = new Date();
    // 经过时长
    let duration = now.getTime() - start.getTime();
    // 一天的毫秒数
    let msPerDay = 24 * 60 * 60 * 1000;
    // 天
    let _day = duration / msPerDay;
    let day = Math.floor(_day);
    // 小时
    let _hour = (_day - day) * 24;
    let hour = Math.floor(_hour);
    // 分钟
    let _minute = (_hour - hour) * 60;
    let minute = Math.floor(_minute);
    // 秒
    let _second = (_minute - minute) * 60;
    let second = Math.floor(_second);
    // 更新span标签内容
    website_runtime.innerHTML="本站已运行:" + day + "天" + hour + "小时" + minute + "分" + second + "秒";
}
show_runtime();
</script>

简化代码

<span id="website_runtime"></span>
<script type="text/javascript">
function show_runtime(){window.setTimeout("show_runtime()",1000);x=new Date("2019/02/08 00:00:00");y=new Date();z=y.getTime()-x.getTime();mspd=24*60*60*1000;_d=z/mspd;d=Math.floor(_d);_h=(_d-d)*24;h=Math.floor(_h);_m=(_h-h)*60;m=Math.floor(_m);_s=(_m-m)*60;s=Math.floor(_s);website_runtime.innerHTML="本站已运行:"+d+"天"+h+"小时"+m+"分"+s+"秒";}show_runtime();
</script>

在网站底部增加运行时长显示
https://chenpipi.cn/post/site-footer-add-run-time/
作者
陈皮皮
发布于
2019年2月14日
更新于
2021年11月18日
许可协议