Javascript time and date output formats EXAMPLES
In JavaScript, date and time are represented by the Date object.
When you run new Date() function, it uses your browser's time zone and displays the date as a full text string.
EXAMPLE
<p id="demo"></p>
<script>
let a=new Date();
document.getElementById("demo").innerHTML=a;
</script>
OUTPUT
Often, this output format, which is too extensive and unreadable, needs to be displayed only in the parts that are required.
Therefore, it is necessary to find ways to display times and dates in the appropriate format.
JavaScript Output Time and Date Methods
The native Date object comes with seven formatting methods.Each of these seven methods give you a specific value:
The date object has about seven formatting methods. Each of these methods gives you a specific value
var a=new Date();
a.toDateString(); output format:
a.toLocaleString() output format:
a.toLocaleTimeString(); output format:
a.toGMTString(); output format:
a.toUTCString(); output format:
a.toISOString(); output format:
a.toString(); output format:
How to create the Time Format in JavaScript
getHours() – This uses the today variable to display the current hour. This uses a 24-hour clock.
getMinutes() – Displays the current minute reading.
getSeconds() – Displays the current seconds reading.
getMilliseconds() – Returns the milliseconds in the specified date according to local time.
EXAMPLE
<p id="demo"></p>
<script>
var a = new Date();
var current_time = a.getHours()+":"+a.getMinutes()+":"+a.getSeconds();
document.getElementById("demo").innerHTML=current_time;
</script>
OUTPUT
Date objects are static, that means it doesn't have a ticking time format like a clock. In order to get the time format that continuously flows and ticks, it is necessary to write a javascript function. In the following example, we have a function where it is refreshed at an interval of one second.
EXAMPLE
<p id="demo"></p>
<script>
function timeNow() {
var a=new Date();
var sas=document.getElementById("demo");
sas.innerHTML=a.toLocaleTimeString();
setInterval(timeNow,1000);
}
timeNow();
</script>
OUTPUT
How to create the Date Format in JavaScript
If you need a custom format, you need to create it yourself.
Writing a custom date format
How To Convert New Date To Dd/Mm/Yyyy Format In Javascript?
getFullYear() – Gets 4-digit year according to local time
getMonth() – Gets month of the year (0-11) according to local time. Month is zero-indexed.
getDate() – Gets day of the month (1-31) according to local time.
getDay() – Gets day of the week (0-6) according to local time. Day of the week begins with Sunday (0) and ends with Saturday (6).
getFullYear() – gets the year as a four digit number (yyyy)
getMonth() – gets the month as a number (0-11)
getDate() – gets the day as a number (1-31)
getHours() – gets the hour (0-23)
EXAMPLE
<p id="demo"></p>
<script>
var a = new Date();
var current_date = a.getFullYear()+"-"+(a.getMonth()+1)+"-"+ a.getDate();
document.getElementById("demo").innerHTML = current_date;
</script>
OUTPUT
Finally, let's show one example of a common edited time and date output format.
EXAMPLE
<p id="demo"></p>
<script>
var a = new Date();
var currentTime = a.getHours()+":"+a.getMinutes()+":"+ a.getSeconds();
var currentDate = a.getDate()+"/"+(a.getMonth()+1)+"/"+ a.getFullYear();
var time_date = currentTime+" - "+currentDate;
document.getElementById("demo").innerHTML = time_date;
</script>
