如何在JavaScript中获取当前日期和时间?


本教程将指导我们如何在JavaScript中获取日期时间。如今,JavaScript是用于用户与浏览器交互的最流行的编程语言。可以说,几乎找不到一个不使用JavaScript的Web应用程序。

创建本教程的目的是使程序员熟悉Date()对象。用户可以使用Date 类获取今天的日期和当前时间。在开发应用程序时,程序员可能需要根据用户的本地时区显示当前日期和时间,我们可以使用Date类来满足此需求。此外,有时我们需要将用户的会话开始和结束时间存储在我们的应用程序数据库中。

为了解决所有这些问题,在本教程中,我们只需创建一个Date类的对象,并使用其各种方法来获取当前日期和时间。

  • 使用Date对象获取日期和时间

  • 使用toLocaleString()方法获取日期和时间

使用Date对象获取日期和时间

Date 类包含几种方法;我们可以使用它们来获取当前的日期、星期几时间。此外,它还包含数百种不同的方法,程序员可以根据自己的需求使用它们。

语法

用户可以按照以下语法使用不同的方法:

let newDate = new Date(); // create the new object of the date class
  • 使用以下语法,用户可以获取年份、月份和日期。

let year = newDate.getFullYear(); // returns the current year
let month = newDate.getMonth(); // returns month between 0 to 11. Users need to add +1 to the returned value to get current month.
let todaySDate = newDate.getDate() // returns today’s date.
  • 使用以下语法,用户可以获取小时、分钟和秒。

let hours = newDate.getHours(); //returns the current hours of the day
let minutes = newDate().getMinutes(); // returns the current minutes of hours
let seconds = newDate.getSeconds(); // returns current the seconds of minutes

示例

以下示例说明如何使用上述方法从Date 对象获取日期和时间。此外,我们还在月份的返回值中加了1,因为它返回的值介于0到11之间。

<html>
<head>
   <title>Get date and time in JavaScript.</title>
</head>
<body>
   <h2>Get date and time using JavaScript.</h2>
   <h4>Output after using the basic methods of the Date() class.</h4>
   <div id="date"> </div>
   <div id="time"> </div>
   <script type="text/javascript">
      let date = document.getElementById("date");
      let time = document.getElementById("time");
      // creating the date object and getting the date and time
      let newDate = new Date();
      let year = newDate.getFullYear();
      let month = newDate.getMonth();
      let todaySDate = newDate.getDate();
      let hours = newDate.getHours();
      let minutes = newDate.getMinutes();
      let seconds = newDate.getSeconds();
      date.innerHTML = " " + todaySDate + "/ " + month + "/ " + year;
      time.innerHTML = hours + ": " + minutes + ": " + seconds;
   </script>
</body>
</html>

在上面的输出中,用户可以看到我们根据本地时区获取当前日期和时间。

使用toLocaleString()方法获取日期和时间

在这种方法中,我们将像上述方法一样使用Date对象,但是这里我们将使用不同的高级方法。我们将使用toLocaleString()方法。它有两个参数,一个是区域设置,另一个是选项。区域设置表示您要获取数据的本地区域或地区,选项是一个包含许多属性的对象。

语法

用户可以按照以下语法使用高级Date对象方法:

let date = new Date();
let dateAndTime = date.toLocaleString(); // returns the date and time both.
let date = date.toLocaleDateString(); // returns the date only.
let time = date.toLocaleTimeString(); // returns the time only.
  • 如果用户想要获取任何本地区域的日期和时间,可以按照以下语法:

let options = {
   year: ‘numeric’,
   month: ‘long’,
   day: ‘numeric’,
   weekday: ‘long’,
}
let date = date.toLocaleString( locale, options);

参数

  • locale − locale参数表示本地区域的Unicode。如果您想获取印度的当前日期和时间,则应传入“en-IN”,对于美国用户,可以传入“en-US”。

  • options − options可以包含许多属性来格式化日期和时间。例如,在上面的语法中,我们编写了返回年份和日期的数字格式,并返回长格式的星期几和月份。

示例

以下示例演示如何使用toLocaleString()方法获取任何特定区域的日期和时间。

<html>
<head>
   <title>Get date and time in JavaScript.</title>
</head>
<body>
   <h4>Output after using toLocaleString() Method.</h4>
   <div id="dateAndTime"> </div>
   <h4> Output after using toLocaleDateString() Method.</h4>
   <div id="date"> </div>
   <h4> Output after using toLocaleTimeString() Method. </h4>
   <div id="time"> </div>
   <h4> Output after using toLocaleString() Method with locale 'en-IN'. </h4>
   <div id="dateIN"> </div>
   <h4> Output after using toLocaleString() Method with local 'en-US'. </h4>
   <div id="dateUs"> </div>
   <script type="text/javascript">
      let dateAndTime = document.getElementById("dateAndTime");
      let date = document.getElementById("date");
      let time = document.getElementById("time");
      let dateIN = document.getElementById("dateIN");
      let dateUs = document.getElementById("dateUs");

      // creating the date object and using the toLocaleString() method
      let newDate = new Date();
      dateAndTime.innerHTML = newDate.toLocaleString();
      date.innerHTML = newDate.toLocaleDateString();
      time.innerHTML = newDate.toLocaleTimeString();

      // options for the toLocaleString() method
      var options = { year: 'numeric', month: 'long', day: 'numeric', weekday: 'long', };
      dateIN.innerHTML = newDate.toLocaleString("en-IN", options);
      dateUs.innerHTML = newDate.toLocaleString("en-US", options);
   </script>
</body>
</html>

在最后两个输出中,用户可以看到我们根据区域获得了不同的日期格式。

结论

Date类包含许多高级方法来获取日期和时间。但是,用户可以使用内置方法获取完整的日期和时间字符串。

用户可以使用Date类的各种方法根据自己的需求获取日期和时间信息。此外,toLocaleString()方法允许您获取区域日期和时间。此外,它还允许您通过将options对象作为参数传递来根据您的需要格式化日期和时间。

更新于:2022年7月20日

9K+ 次浏览

启动您的职业生涯

完成课程获得认证

开始学习
广告