前端获取时间戳详解

发布时间:2023-05-18

一、前端获取时间戳13位与10位区别

时间戳是指从1970年01月01日00时00分00秒开始到现在的秒数。前端获取时间戳有两种形式:13位时间戳和10位时间戳。13位时间戳是指当前时间的毫秒数,10位时间戳是指当前时间的秒数。

二、前端获取时间戳是为什么

前端获取时间戳可以用于实现一些时间相关的功能,例如计时器、倒计时、日期选择器等。

三、前端获取时间戳转换为时间格式

/**
 * 将时间戳转换为时间格式
 * @param {number} timestamp - 时间戳
 * @param {string} format - 时间格式,例如 'yyyy-MM-dd HH:mm:ss'
 * @return {string} 转换后的时间字符串
 */
function formatTimestamp(timestamp, format) {
  var date = new Date(timestamp);
  var year = date.getFullYear();
  var month = date.getMonth() + 1;
  var day = date.getDate();
  var hour = date.getHours();
  var minute = date.getMinutes();
  var second = date.getSeconds();
  var padding = function (num) { return num < 10 ? '0' + num : num };
  return format.replace('yyyy', year).replace('MM', padding(month)).replace('dd', padding(day)).replace('HH', padding(hour)).replace('mm', padding(minute)).replace('ss', padding(second));
}

上述代码中的 format 参数是时间格式字符串,可以自定义格式,也可以使用常用格式,例如 'yyyy-MM-dd HH:mm:ss'

四、前端获取服务器时间戳

/**
 * 获取服务器时间戳
 * @param {Function} callback - 回调函数,获取服务器时间成功后执行
 */
function getServerTimestamp(callback) {
  var xhr = new XMLHttpRequest();
  xhr.open('HEAD', window.location.href, true);
  xhr.onreadystatechange = function () {
    if (xhr.readyState === 4) {
      var serverTimestamp = new Date(xhr.getResponseHeader('Date')).getTime();
      callback(serverTimestamp);
    }
  };
  xhr.send(null);
}

上述代码中的 XMLHttpRequest 使用 HEAD 方法获取服务器响应头中的 Date 字段,该字段是服务器当前时间的时间戳,通过 getTime() 方法可以获得对应的毫秒数。callback 参数是获取服务器时间成功后的回调函数。

五、前端获取时间戳为null

前端获取时间戳为 null 的情况可能是在出错或者不支持的浏览器中出现,需要注意处理。

六、前端获取时间戳1000

在一些需要直接使用时间戳的场合,需要将秒级的时间戳转换为毫秒级的时间戳,例如:

var timestamp = 1620139865; // 秒级时间戳
var timestamp_ms = timestamp * 1000; // 毫秒级时间戳

七、前端怎么实时获取时间

可以使用 setInterval() 函数来定时获取当前时间并更新显示:

setInterval(function() {
  var now = new Date(); // 获取当前时间
  var formattedTime = formatTimestamp(now, 'yyyy-MM-dd HH:mm:ss'); // 转换为格式化时间字符串
  document.getElementById('time').textContent = formattedTime; // 更新显示
}, 1000); // 每秒钟更新一次

上述代码中的 formatTimestamp() 函数是前面介绍的将时间戳转换为时间格式的函数,可以自定义时间格式。document.getElementById('time') 是要更新的显示元素。

八、前端获取当前时间

可以直接创建 Date 对象获取当前时间:

var now = new Date(); // 获取当前时间对象
var timestamp = now.getTime(); // 获取时间戳
var formattedTime = formatTimestamp(now, 'yyyy-MM-dd HH:mm:ss'); // 转换为格式化时间字符串

九、前端时间戳转换日期格式

前面已经介绍了将时间戳转换为时间格式的函数,可以直接使用该函数:

var timestamp = 1620139865000; // 毫秒级时间戳
var formattedTime = formatTimestamp(timestamp, 'yyyy-MM-dd HH:mm:ss'); // 转换为格式化时间字符串

十、前端给后端传递时间戳

在向后端传递时间信息时,通常使用时间戳作为参数。

var timestamp = new Date().getTime(); // 获取当前时间戳
var xhr = new XMLHttpRequest();
xhr.open('GET', '/api?timestamp=' + timestamp, true);
xhr.send(null);

上述代码中的 /api 是后端接口的 URL,timestamp 是时间戳参数。