js实现按创建时间戳1609459200000 开始往后开始显示运行时长-demo

运行时长 00日 00时 17分 59秒

代码

function calculateRuntime(timestamp) {
  const startTime = Date.now(); // 获取当前时间戳
  //const runtimeElement = document.getElementById('runtime'); // 获取显示运行时长的元素

  function updateRuntime() {
    const currentTimestamp = Date.now(); // 获取当前时间戳
    const runtime = currentTimestamp - timestamp; // 计算运行时长

    // 将运行时长格式化为 "00日 00时 17分 59秒" 的形式
    const days = Math.floor(runtime / (1000 * 60 * 60 * 24)).toString().padStart(2, '0');
    const hours = Math.floor((runtime % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)).toString().padStart(2, '0');
    const minutes = Math.floor((runtime % (1000 * 60 * 60)) / (1000 * 60)).toString().padStart(2, '0');
    const seconds = Math.floor((runtime % (1000 * 60)) / 1000).toString().padStart(2, '0');

    const formattedRuntime = `${days}日 ${hours}时 ${minutes}分 ${seconds}秒`;

    //runtimeElement.innerText = formattedRuntime; // 更新显示的运行时长
    console.log(formattedRuntime)
  }

  // 初始更新一次运行时长
  updateRuntime();

  // 每秒更新一次运行时长
  setInterval(updateRuntime, 1000);
}

使用示例 

const timestamp = 1609459200000; // 替换为你的13位时间戳
calculateRuntime(timestamp);

代码优化

/**
 * 运行时长格式化
 * @param ms 时间戳 13位
 */
function timeFormatHandle(runtime) {
  // 将运行时长格式化为 "00日 00时 17分 59秒" 的形式
  const days = Math.floor(runtime / (1000 * 60 * 60 * 24))
    .toString()
    .padStart(2, '0');
  const hours = Math.floor((runtime % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))
    .toString()
    .padStart(2, '0');
  const minutes = Math.floor((runtime % (1000 * 60 * 60)) / (1000 * 60))
    .toString()
    .padStart(2, '0');
  const seconds = Math.floor((runtime % (1000 * 60)) / 1000)
    .toString()
    .padStart(2, '0');

  const formattedRuntime = `${days}日 ${hours}时 ${minutes}分 ${seconds}秒`;
  console.log(formattedRuntime);
}

let dateTimer = null;

function closeDateTimer() {
  if (dateTimer) {
    clearTimeout(dateTimer);
    dateTimer = null;
  }
}

function runRateTime(ms) {
  closeDateTimer();
  //timeFormatHandle(ms);
  dateTimer = setTimeout(() => {
    timeFormatHandle(ms); // 保留一个即可
    runRateTime(ms + 1000);
  }, 1000);
}

const timestamp = 1691640413734; //创建时间戳
closeDateTimer() 
runRateTime(new Date().getTime() - timestamp);

const startTime = 1609459200000; // 开始时间戳

function displayRuntime() {
  const now = Date.now(); // 当前时间戳
  let runtime = now - startTime; // 运行时长,单位为毫秒

  const oneDay = 24 * 60 * 60 * 1000; // 一天的毫秒数
  const oneHour = 60 * 60 * 1000; // 一小时的毫秒数
  const oneMinute = 60 * 1000; // 一分钟的毫秒数

  // 计算天数
  let days = Math.floor(runtime / oneDay);
  runtime = runtime % oneDay;

  // 计算小时数
  let hours = Math.floor(runtime / oneHour);
  runtime = runtime % oneHour;

  // 计算分钟数
  let minutes = Math.floor(runtime / oneMinute);
  runtime = runtime % oneMinute;

  // 计算秒数
  let seconds = Math.floor(runtime / 1000);

  const displayDays = padZero(days); // 补零显示天数
  const displayHours = padZero(hours); // 补零显示小时数
  const displayMinutes = padZero(minutes); // 补零显示分钟数
  const displaySeconds = padZero(seconds); // 补零显示秒数

  console.log(`运行时长 ${displayDays}日 ${displayHours}时 ${displayMinutes}分 ${displaySeconds}秒`);
}

// 补零函数,将一位数前面补零
function padZero(num) {
  if (num < 10) {
    return '0' + num;
  } else {
    return num;
  }
}

// 每秒钟更新一次运行时长
setInterval(displayRuntime, 1000);

优化

const displayRuntime=(startTime)=> {
  const now = Date.now(); // 当前时间戳
  let runtime = now - startTime; // 运行时长,单位为毫秒
 
  const oneDay = 24 * 60 * 60 * 1000; // 一天的毫秒数
  const oneHour = 60 * 60 * 1000; // 一小时的毫秒数
  const oneMinute = 60 * 1000; // 一分钟的毫秒数
 
  // 计算天数
  let days = Math.floor(runtime / oneDay).toString().padStart(2, '0');
  runtime = runtime % oneDay;
 
  // 计算小时数
  let hours = Math.floor(runtime / oneHour).toString().padStart(2, '0');
  runtime = runtime % oneHour;
 
  // 计算分钟数
  let minutes = Math.floor(runtime / oneMinute).toString().padStart(2, '0');
  runtime = runtime % oneMinute;
 
  // 计算秒数
  let seconds = Math.floor(runtime / 1000).toString().padStart(2, '0');
 
  console.log(`运行时长 ${days}日 ${hours}时 ${minutes}分 ${seconds}秒`);
}

displayRuntime(1691994296457)//运行时长 00日 00时 16分 06秒

猜你喜欢

转载自blog.csdn.net/JackieDYH/article/details/132209101