获取当前时间的前十二个小时时间

最新推荐文章于 2023-05-04 08:27:14 发布

*初级小白*~

最新推荐文章于 2023-05-04 08:27:14 发布

阅读量904

点赞数 1

分类专栏： svg 文章标签： javascript

本文链接：https://blog.csdn.net/scumstudy/article/details/123652265

版权

svg 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本文介绍了如何使用JavaScript和HTML实现一个动态的时间轴，通过moment.js处理日期并生成'HH:mm'格式的时间。核心内容包括时间戳计算、分段显示和列表生成，适合前端开发者了解时间线组件的实现方法。

摘要由CSDN通过智能技术生成

在这里插入图片描述

   <g
        id="timeScale"
        transform="translate(0,28)"
        fill="none"
        font-size="10"
        font-family="sans-serif"
        text-anchor="middle"
      >
        <path class="domain" stroke="currentColor" d="M10.5,0.5H1890.5"></path>
        <g
          :class="{ minor: index % 12 == 0 }"
          opacity="1"
          :transform="`translate(${(1880 / 144) * index + 10},0)`"
          v-for="(item, index) in timeList"
          :key="index"
        >
          <line stroke="currentColor" :y2="index % 12 == 0 ? 9 : 6"></line>
          <text fill="#000" y="14" dy="0.71em" v-if="index % 12 == 0">
            {{ item }}
          </text>
        </g>
      </g>

getTime() {
      let endDate = new Date();
      let splitTime = 5 * 60 * 1000;
      let count = 144;
      //转为时间戳
      let endTime = endDate.getTime();
      let mod = endTime % splitTime;
      if (mod > 0) {
        endTime = endTime - mod;
      }
      while (count-- > 0) {
        let d = new Date();
        d.setTime(endTime - count * splitTime);
        this.timeList.push(moment(d).format("HH:mm"));
      }
    },