Maison > interface Web > js tutoriel > Comment convertir la date dans un autre fuseau horaire en JavaScript ?

Comment convertir la date dans un autre fuseau horaire en JavaScript ?

王林
Libérer: 2023-09-08 23:17:02
avant
1252 Les gens l'ont consulté

如何在 JavaScript 中将日期转换为另一个时区?

JavaScript a un nouveau constructeur Date() qui est utilisé pour créer un objet date pour obtenir la date et l'heure actuelles. Cet objet date utilise le fuseau horaire UTC ou le fuseau horaire du navigateur client, c'est-à-dire si vous êtes en Inde et utilisez le. nouveau constructeur Date() pour obtenir la date et l'heure, vous obtiendrez votre heure locale. Mais parfois, nous pouvons avoir besoin d'obtenir le fuseau horaire d'un autre pays, ce que nous ne pouvons pas faire directement en utilisant toLocaleString(). ou la méthode format(). À la fin de l'article, vous pourrez obtenir la date de n'importe quel autre fuseau horaire en JavaScript.

Les deux méthodes que nous utiliserons dans cet article pour convertir une date dans un autre fuseau horaire sont les suivantes −

  • Utilisation de la méthode toLocaleString()

  • Utilisez la méthode format()

Utilisez la méthode toLocaleString()

La méthode

toLocaleString() peut être appelée à l’aide d’objets date. Cette méthode a la capacité de convertir les données d'un fuseau horaire à un autre en fonction des paramètres transmis. Il accepte deux paramètres, le premier paramètre est "locale", qui est la langue de la convention de format qui doit être utilisée, pour l'anglais c'est "en-US", le deuxième paramètre est "options", pour nous c'est {timeZone : "countryName"}, où countryName est le nom du pays dont nous souhaitons modifier le fuseau horaire.

Voici le processus étape par étape pour convertir une date vers un autre fuseau horaire en JavaScript à l'aide de la méthode toLocaleString().

  • Créez un objet date à l'aide du constructeur Date

  • Utilisez l'objet date avec la méthode toLocaleString() et transmettez le premier argument comme 'en-US' pour le formatage de la date et de l'heure en anglais, et le deuxième argument {timeZone: "America/New_York"} pour obtenir le fuseau horaire de New York

  • Stockez la valeur renvoyée par cette méthode dans une variable, cette variable est notre fuseau horaire requis.

Exemple

Dans cet exemple, nous utilisons la méthode toLocaleString() de JavaScript pour convertir une date dans un autre fuseau horaire.

<!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>
Copier après la connexion

Utilisation de la méthode Format()

Nous pouvons utiliser la méthode format() avec l'objet "Intl.DateTimeFormat" et utiliser l'objet date passé comme argument à la méthode format() pour convertir le fuseau horaire en un fuseau horaire transmis lors de la création de l'objet "Intl.DateTimeFormat". Cela semble compliqué mais c'est très simple si vous regardez l'exemple ci-dessous.

Voici la procédure étape par étape pour convertir une date dans un autre fuseau horaire en JavaScript à l'aide de la méthode format().

  • Créez un objet date à l'aide du constructeur Date.

  • Lors de la création de l'objet "Intl.DateTimeFormat", définissez le premier paramètre sur "en-US" pour le formatage de la date et de l'heure en anglais, et le deuxième paramètre {timeZone : "America/New_York"} pour obtenir le fuseau horaire de New York. York.

  • Utilisez la méthode format() avec cet objet et transmettez l'objet date comme argument et stockez-le dans une variable, cette variable est notre fuseau horaire requis.

Exemple

Dans cet exemple, nous convertissons une date en un autre fuseau horaire en JavaScript à l'aide de la méthode format().

<!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>
Copier après la connexion

Résumé

Résumons ce que nous avons appris dans ce tutoriel. Nous voyons que nous avons deux façons de convertir une date dans un autre fuseau horaire, la première consiste à utiliser la méthode toLocaleString() de l'objet date et la seconde utilise la méthode format() de l'objet "Intl.DateTimeFormat". Ces deux méthodes ont des cas d'utilisation différents et vous pouvez choisir en fonction de vos besoins. Nous recommandons d'utiliser la méthode toLocaleString(), qui est simple à utiliser et nécessite moins de lignes de code que l'utilisation de la méthode format() de l'objet "Intl.DateTimeFormat".

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:tutorialspoint.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal