您的位置:

如何获取当前系统时间 - 代码实现教程

在很多场合下,获取当下的时间是非常有必要的一个操作,比如在网页上显示当前时间、记录用户操作时间等等。那么,在编写 JavaScript 代码时,我们如何获取当前系统时间呢?以下是本文的主要内容。

一、使用 Date() 方法获取当前系统时间


var now = new Date();
console.log(now);

上述代码使用内置的 JavaScript 方法 Date() 获取当前的时间,并将其存储在变量 now 中。Date() 方法无参数时,获取的即为当前的系统时间。

需要注意的是,Date() 方法所获取的时间为本地时间,即当前计算机上所设置的时间。这里需要再次强调,Date() 方法所获取的是本地时间,而非 GMT 时间(格林尼治标准时间)。因此,如果需要获取 GMT 时间或其他时区的时间,需要通过其他方法转换时间。

二、使用 toLocaleString() 方法格式化时间显示


var now = new Date();
console.log(now.toLocaleString());

上述代码中,我们使用内置的 JavaScript 方法 toLocaleString() 对获取到的时间进行格式化。该方法会将本地时间转换成具有可读性的字符串格式。toLocaleString() 方法参数为空时,其默认格式为 "yyyy/MM/dd 上午/下午 hh:mm:ss"。

关于 toLocaleString() 方法的更多参数详解,可以查阅官方文档:

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString

三、使用 getMonth(), getDate(), getFullYear() 等方法获取时间组成部分


var now = new Date();
var year = now.getFullYear();
var month = now.getMonth() + 1;
var date = now.getDate();
var hour = now.getHours();
var minute = now.getMinutes();
var second = now.getSeconds();
console.log(`当前时间是:${year}年${month}月${date}日 ${hour}:${minute}:${second}`);

上述代码中,我们使用 Date() 方法获取当前时间,并使用 getFullYear()、getMonth()、getDate()、getHours()、getMinutes()、getSeconds() 等方法获取当前时间的年、月、日、时、分、秒组成部分。需要注意的是,getMonth() 方法返回的月份范围是 0 到 11,因此我们需要将其加 1 才能得到真实的月份。

四、使用 setInterval() 方法实现时间动态显示


function showTime() {
  var now = new Date();
  var year = now.getFullYear();
  var month = now.getMonth() + 1;
  var date = now.getDate();
  var hour = now.getHours();
  var minute = now.getMinutes();
  var second = now.getSeconds();
  
  var timeStr = `${year}年${month}月${date}日 ${hour}:${minute}:${second}`;
  document.getElementById('time').innerText = timeStr;
}
setInterval(showTime, 1000);

以上代码展示了如何使用 JavaScript 中的 setInterval() 方法实现时间的动态显示。setInterval() 方法用于在指定的时间间隔内重复执行某个任务或函数。

在以上代码中,我们定义了一个函数 showTime(),用于获取当前的时间,并生成相应的字符串。我们每隔 1 秒钟(即 1000 毫秒)调用一次 showTime() 函数,并将结果输出到对应的 HTML 元素中,实现时间的动态显示。

五、结语

本文从多个方面对获取当前系统时间进行了详细的介绍和示范。其中讲解的代码,可以直接在浏览器的开发者工具中进行测试和练习。