如何在 JavaScript 中將日期轉(zhuǎn)換為另一個(gè)時(shí)區(qū)？-魔扣目錄

JavaScript has a new Date() constructor which is used to create a date object to get the current date and time. This date object uses the UTC timezone or the client browser’s timezone, i.e. if you are in India and use the new Date() constructor to get the date and time, you will get your local time. But sometimes, we may need to get the timezone of another country, which we can’t do directly. These can be done using the toLocaleString() method or the format() method. By the end of the article, you will be able to get the date of any other timezone in JavaScript.

The two methods that we will use in this article to convert a date to another time zone are as follows ?

Using toLocaleString() Method

使用format()方法

使用 toLocaleString() 方法

toLocaleString() 方法可以使用日期對(duì)象調(diào)用。該方法具有根據(jù)傳入的參數(shù)將數(shù)據(jù)從一個(gè)時(shí)區(qū)轉(zhuǎn)換為另一個(gè)時(shí)區(qū)的能力。它接受兩個(gè)參數(shù)，第一個(gè)參數(shù)是“l(fā)ocale”，它是應(yīng)該使用的格式約定的語(yǔ)言，對(duì)于英語(yǔ)來(lái)說(shuō)是“en-US”，第二個(gè)參數(shù)是“options”，對(duì)于我們來(lái)說(shuō)是{timeZone：“countryName”}，其中countryName是我們想要更改時(shí)區(qū)的國(guó)家的名稱。

以下是使用toLocaleString()方法在JavaScript中將日期轉(zhuǎn)換為另一個(gè)時(shí)區(qū)的逐步過(guò)程。

使用Date構(gòu)造函數(shù)創(chuàng)建一個(gè)日期對(duì)象

Use the date object with toLocaleString() method and pass the first argument as ‘en-US’ for English language date and time formatting, and the second argument {timeZone: “America/New_York”} for getting the timezone of New York

Store the value return from this method into a variable, that variable is our required timezone.

Example

在這個(gè)例子中，我們使用JavaScript的toLocaleString()方法將一個(gè)日期轉(zhuǎn)換為另一個(gè)時(shí)區(qū)。

<!DOCTYPE html>
<html lang="en">
<head>
   <title>Converting date to another timezone in JavaScript</title>
</head>
<body>
   <h3>Convert date to America/New_York Time Zone using toLocaleString() Method</h3>
   <p id="input">Local Time: </p>
   <p id="output">America/New_York Time Zone: </p>
   <script>
      // date objec
      let date = new Date();
      document.getElementById("input").innerText += date ;
      
      // convert date to another timezone
      let output = date.toLocaleString("en-US", {
         timeZone: "America/New_York"
      });
      
      // display the result
      document.getElementById("output").innerText += output;
   </script>
</body>
</html>

登錄后復(fù)制

Using Format() Method

We can use the format() method with the “Intl.DateTimeFormat” object and use the date object passed as an argument to the format() method to convert the timezone to a timezone passed while creating the “Intl.DateTimeFormat” object. It sounds complicated but it is very simple if you look at the example below.

Here is the step-wise procedure to convert a date to another timezone in JavaScript using format() Method.

Create a date object using the Date constructor.

在創(chuàng)建“Intl.DateTimeFormat”對(duì)象時(shí)，將第一個(gè)參數(shù)設(shè)置為’en-US’以進(jìn)行英語(yǔ)語(yǔ)言的日期和時(shí)間格式化，第二個(gè)參數(shù){timeZone: “America/New_York”}用于獲取紐約的時(shí)區(qū)。

Use the format() method with this object and pass the date object as an argument and store it in a variable, that variable is our required timezone.

Example

In this example, we are converting a date to another timezone in JavaScript using the format() Method.

<!DOCTYPE html>
<html lang="en">
<head>
   <title>Convert date to America/New_York timezone in JavaScript</title>
</head>
<body>
   <h3>Convert date to America/New_York timezone using format() Method</h3>
   <p id="input">Local Time: </p>
   <p id="output">America/New_York Time Zone: </p>
   <script>
      // date objec
      let date = new Date();
      document.getElementById("input").innerText += date ;
      
      // create a new date object
      let newObj = Intl.DateTimeFormat('en-US', {
         timeZone: "America/New_York"
      })
      
      // convert date to another timezone
      let newDate = newObj.format(date);
      
      // display the result
      document.getElementById("output").innerHTML += newDate;
   </script>
</body>
</html>

登錄后復(fù)制

Summary

讓我們總結(jié)一下在本教程中學(xué)到的內(nèi)容。我們看到我們有兩種方法可以將日期轉(zhuǎn)換為另一個(gè)時(shí)區(qū)，第一種是使用日期對(duì)象的toLocaleString()方法，第二種是使用”Intl.DateTimeFormat”對(duì)象的format()方法。這兩種方法有不同的用例，你可以根據(jù)自己的需要選擇。我們推薦使用toLocaleString()方法，它易于使用，而且比使用”Intl.DateTimeFormat”對(duì)象的format()方法需要更少的代碼行。

以上就是如何在 JavaScript 中將日期轉(zhuǎn)換為另一個(gè)時(shí)區(qū)？的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注www.92cms.cn其它相關(guān)文章！