My website currently displays UTC time like this:
2022-03-22T23:38:25.748Z
But I would like for it to be formatted like this:
23:39:22 UTC
Here is the javascript I have:
<script type="text/javascript">
function display_c(){
var refresh=1000; // Refresh rate in milli seconds
mytime=setTimeout('display_ct()',refresh)
}
function display_ct() {
var x = new Date()
var x1=x.toISOString();// changing the display to UTC string
document.getElementById('ct').innerHTML = x1;
tt=display_c();
}
<body onload=display_ct();><span id='ct' >
Can you help me format this? I've looked into using angular and searched other methods for implementing this but it seems that there are many ways to do this. The things I've tried do not display the format correctly. The code above is the closest solution I have found.
This should produce the format you want to have.
let date = new Date();
let utc_string = date.toUTCString().match(/..:..:.. .*/)[0];
console.log(utc_string);Use the Intl.DateTimeFormat method for this as follows:
function display_c(){
const refresh = 1000;
mytime = setTimeout('display_ct()',refresh)
}
function display_ct() {
let dtf = new Intl.DateTimeFormat("en-GB", { timeZone: "GMT", hour12: false, timeStyle: "long" });
document.getElementById('ct').innerHTML = dtf.format( new Date() );
tt = display_c();
}
display_ct();<div id="ct"></div>You can either use the various configuration options available to customize the format of the datetime, or use the following setup for displaying a custom String:
function display_ct() {
let dtf = new Intl.DateTimeFormat("en-GB", { timeZone: "GMT", hour12: false, timeStyle: "medium" });
document.getElementById('ct').innerHTML = dtf.format( new Date() ) + " Zulu";
}
Available configuration options: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat
new Date().toISOString().slice(11, 19) + ' UTC'
A nice and intentional property of the ISO datetime format is that most of the parts are always the same length.
Note that truncating, not rounding, is the correct behavior.