使用JS为博客添加运行时间
in JS with 2 comment

使用JS为博客添加运行时间

in JS with 2 comment

前言

看到别人博客有运行时间,自己也想实现,实现的方式有很多种

实现方式

这里使用最后一种方式来实现,直接上代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
  </head>
  <body>
    <span id="showsectime"></span>
    <script>
      function NewDate(str) {
        var reg = /\s+|:/g;//匹配多空格和:
        str = str.replace(reg, "-");//将空格和:替换成_,便于分割
        str = str.split("-");//分割
        var date = new Date();//构造时间
        date.setUTCFullYear(str[0], str[1] - 1, str[2]);
        date.setUTCHours(str[3], str[4], str[5], 0);
        return date;
      }
      function showsectime() {
        //开始时间  按照这个格式来 这里可以直接写死  
        var birthDay = NewDate("2019-02-23 00:00:00");
        //请求时间    这里需要从服务器获取 当然也可以使用本地时间 由于使用freemarket 可以使用${.now}获取
        var today = new NewDate("2019-02-25 23:59:50");
        //相差的时间
        var mss = today.getTime() - birthDay.getTime();
        var daysold = parseInt(mss / (1000 * 60 * 60 * 24));
        var hrsold = parseInt((mss % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minsold = parseInt((mss % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = (mss % (1000 * 60)) / 1000;

        setInterval(function() {
          if (seconds < 59) {
            seconds = seconds + 1;
          } else {
            seconds = 0;
            minsold = minsold + 1;
            if (minsold < 59) {
            } else {
              minsold = 0;
              hrsold = hrsold + 1;
              if (hrsold < 23) {
              } else {
                hrsold = 0;
                daysold = daysold + 1;
              }
            }
          }
          document.getElementById("showsectime").innerHTML =
            "本站已安全运行" +
            daysold +
            "天" +
            hrsold +
            "小时" +
            minsold +
            "分" +
            seconds +
            "秒";
        }, 1000);
      }
      showsectime();
    </script>
  </body>
</html>

说明

js时间初始化有以下几种方式 *new Date("month dd,yyyy hh:mm:ss"); *new Date("month dd,yyyy"); *new Date(yyyy,mth,dd,hh,mm,ss); *new Date(yyyy,mth,dd); *new Date(ms);利用时间戳初始化

方法	描述
Date()	返回当日的日期和时间。
getDate()	从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay()	从 Date 对象返回一周中的某一天 (0 ~ 6)。
getMonth()	从 Date 对象返回月份 (0 ~ 11)。
getFullYear()	从 Date 对象以四位数字返回年份。
getYear()	请使用 getFullYear() 方法代替。
getHours()	返回 Date 对象的小时 (0 ~ 23)。
getMinutes()	返回 Date 对象的分钟 (0 ~ 59)。
getSeconds()	返回 Date 对象的秒数 (0 ~ 59)。
getMilliseconds()	返回 Date 对象的毫秒(0 ~ 999)。
getTime()	返回 1970 年 1 月 1 日至今的毫秒数。
getTimezoneOffset()	返回本地时间与格林威治标准时间 (GMT) 的分钟差。
getUTCDate()	根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
getUTCDay()	根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
getUTCMonth()	根据世界时从 Date 对象返回月份 (0 ~ 11)。
getUTCFullYear()	根据世界时从 Date 对象返回四位数的年份。
getUTCHours()	根据世界时返回 Date 对象的小时 (0 ~ 23)。
getUTCMinutes()	根据世界时返回 Date 对象的分钟 (0 ~ 59)。
getUTCSeconds()	根据世界时返回 Date 对象的秒钟 (0 ~ 59)。
getUTCMilliseconds()	根据世界时返回 Date 对象的毫秒(0 ~ 999)。
parse()	返回1970年1月1日午夜到指定日期(字符串)的毫秒数。
setDate()	设置 Date 对象中月的某一天 (1 ~ 31)。
setMonth()	设置 Date 对象中月份 (0 ~ 11)。
setFullYear()	设置 Date 对象中的年份(四位数字)。
setYear()	请使用 setFullYear() 方法代替。
setHours()	设置 Date 对象中的小时 (0 ~ 23)。
setMinutes()	设置 Date 对象中的分钟 (0 ~ 59)。
setSeconds()	设置 Date 对象中的秒钟 (0 ~ 59)。
setMilliseconds()	设置 Date 对象中的毫秒 (0 ~ 999)。
setTime()	以毫秒设置 Date 对象。
setUTCDate()	根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
setUTCMonth()	根据世界时设置 Date 对象中的月份 (0 ~ 11)。
setUTCFullYear()	根据世界时设置 Date 对象中的年份(四位数字)。
setUTCHours()	根据世界时设置 Date 对象中的小时 (0 ~ 23)。
setUTCMinutes()	根据世界时设置 Date 对象中的分钟 (0 ~ 59)。
setUTCSeconds()	根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。
setUTCMilliseconds()	根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。
toSource()	返回该对象的源代码。
toString()	把 Date 对象转换为字符串。
toTimeString()	把 Date 对象的时间部分转换为字符串。
toDateString()	把 Date 对象的日期部分转换为字符串。
toGMTString()	请使用 toUTCString() 方法代替。
toUTCString()	根据世界时,把 Date 对象转换为字符串。
toLocaleString()	根据本地时间格式,把 Date 对象转换为字符串。
toLocaleTimeString()	根据本地时间格式,把 Date 对象的时间部分转换为字符串。
toLocaleDateString()	根据本地时间格式,把 Date 对象的日期部分转换为字符串。
UTC()	根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。
valueOf()	返回 Date 对象的原始值。
2评论
  • ahxx

    博主大大请问你的评论里添加表情是用的什么插件?

    • bobey 博主

      @ahxx 你找下owo,应该就是这个