Current time formatting with Javascript

Question

I want to get current time in a specific format with javascript   With the function below and calling it will give me  Fri Feb 01 2013 13 56 40 GMT 1300  New Zealand Daylight Time  but I want to format it like Friday 2 00pm 1 Feb 2013  var d   new Date    var x   document getElementById  time    x innerHTML   d    Of course  code above doesn t have any formatting logic but I have not come across with any  working  formatters yet

User · Answer

For this true mysql style use this function below: 2019/02/28 15:33:12

If you click the
'Run code snippet' button below
It will show your an simple realtime digital clock example The demo will appear below the code snippet.

_x000D_

function getDateTime() {_x000D_
        var now     = new Date(); _x000D_
        var year    = now.getFullYear();_x000D_
        var month   = now.getMonth()+1; _x000D_
        var day     = now.getDate();_x000D_
        var hour    = now.getHours();_x000D_
        var minute  = now.getMinutes();_x000D_
        var second  = now.getSeconds(); _x000D_
        if(month.toString().length == 1) {_x000D_
             month = '0'+month;_x000D_
        }_x000D_
        if(day.toString().length == 1) {_x000D_
             day = '0'+day;_x000D_
        }   _x000D_
        if(hour.toString().length == 1) {_x000D_
             hour = '0'+hour;_x000D_
        }_x000D_
        if(minute.toString().length == 1) {_x000D_
             minute = '0'+minute;_x000D_
        }_x000D_
        if(second.toString().length == 1) {_x000D_
             second = '0'+second;_x000D_
        }   _x000D_
        var dateTime = year+'/'+month+'/'+day+' '+hour+':'+minute+':'+second;   _x000D_
         return dateTime;_x000D_
    }_x000D_
_x000D_
    // example usage: realtime clock_x000D_
    setInterval(function(){_x000D_
        currentTime = getDateTime();_x000D_
        document.getElementById("digital-clock").innerHTML = currentTime;_x000D_
    }, 1000);

_x000D_

<div id="digital-clock"></div>

_x000D_

User · Answer

A JavaScript Date has several methods allowing you to extract its parts   getFullYear   - Returns the 4-digit year getMonth   - Returns a zero-based integer  0-11  representing the month of the year  getDate   - Returns the day of the month  1-31   getDay   - Returns the day of the week  0-6    0 is Sunday  6 is Saturday  getHours   - Returns the hour of the day  0-23   getMinutes   - Returns the minute  0-59   getSeconds   - Returns the second  0-59   getMilliseconds   - Returns the milliseconds  0-999   getTimezoneOffset   - Returns the number of minutes between the machine local time and UTC   There are no built-in methods allowing you to get localized strings like  Friday    February   or  PM    You have to code that yourself   To get the string you want  you at least need to store string representations of days and months   var months     Jan    Feb    Mar    Apr    May    Jun    Jul    Aug    Sep    Oct    Nov    Dec    var days     Sunday    Monday    Tuesday    Wednesday    Thursday    Friday    Saturday      Then  put it together using the methods above    x000D   x000D  var months     Jan    Feb    Mar    Apr    May    Jun    Jul    Aug    Sep    Oct    Nov    Dec    x000D  var days     Sunday    Monday    Tuesday    Wednesday    Thursday    Friday    Saturday    x000D  var d   new Date    x000D  var day   days d getDay     x000D  var hr   d getHours    x000D  var min   d getMinutes    x000D  if  min  lt  10    x000D      min    0    min  x000D    x000D  var ampm    am   x000D  if  hr  gt  12     x000D      hr -  12  x000D      ampm    pm   x000D    x000D  var date   d getDate    x000D  var month   months d getMonth     x000D  var year   d getFullYear    x000D  var x   document getElementById  time    x000D  x innerHTML   day         hr         min   ampm         date         month         year  x000D   lt span id  time  gt  lt  span gt  x000D   x000D   x000D    I have a date format function I like to include in my standard library   It takes a format string parameter that defines the desired output   The format strings are loosely based on  Net custom Date and Time format strings   For the format you specified the following format string would work    dddd h mmtt d MMM yyyy    var d   new Date    var x   document getElementById  time    x innerHTML   formatDate d   dddd h mmtt d MMM yyyy      Demo  jsfiddle net BNkkB 1  Here is my full date formatting function   function formatDate date  format  utc        var MMMM      x00    January    February    March    April    May    June    July    August    September    October    November    December        var MMM      x01    Jan    Feb    Mar    Apr    May    Jun    Jul    Aug    Sep    Oct    Nov    Dec        var dddd      x02    Sunday    Monday    Tuesday    Wednesday    Thursday    Friday    Saturday        var ddd      x03    Sun    Mon    Tue    Wed    Thu    Fri    Sat         function ii i  len            var s   i               len   len    2          while  s length  lt  len  s    0    s          return s             var y   utc   date getUTCFullYear     date getFullYear        format   format replace           yyyy  g    1    y       format   format replace           yy g    1    y toString   substr 2  2        format   format replace           y g    1    y        var M    utc   date getUTCMonth     date getMonth      1      format   format replace           MMMM  g    1    MMMM 0        format   format replace           MMM g    1    MMM 0        format   format replace           MM g    1    ii M        format   format replace           M g    1    M        var d   utc   date getUTCDate     date getDate        format   format replace           dddd  g    1    dddd 0        format   format replace           ddd g    1    ddd 0        format   format replace           dd g    1    ii d        format   format replace           d g    1    d        var H   utc   date getUTCHours     date getHours        format   format replace           HH  g    1    ii H        format   format replace           H g    1    H        var h   H  gt  12   H - 12   H    0   12   H      format   format replace           hh  g    1    ii h        format   format replace           h g    1    h        var m   utc   date getUTCMinutes     date getMinutes        format   format replace           mm  g    1    ii m        format   format replace           m g    1    m        var s   utc   date getUTCSeconds     date getSeconds        format   format replace           ss  g    1    ii s        format   format replace           s g    1    s        var f   utc   date getUTCMilliseconds     date getMilliseconds        format   format replace           fff  g    1    ii f  3        f   Math round f   10       format   format replace           ff g    1    ii f        f   Math round f   10       format   format replace           f g    1    f        var T   H  lt  12    AM     PM       format   format replace           TT  g    1    T       format   format replace           T g    1    T charAt 0         var t   T toLowerCase        format   format replace           tt  g    1    t       format   format replace           t g    1    t charAt 0         var tz   -date getTimezoneOffset        var K   utc     tz    Z    tz  gt  0          -       if   utc            tz   Math abs tz           var tzHrs   Math floor tz   60           var tzMin   tz   60          K    ii tzHrs          ii tzMin             format   format replace           K g    1    K        var day    utc   date getUTCDay     date getDay      1      format   format replace new RegExp dddd 0    g    dddd day        format   format replace new RegExp ddd 0    g    ddd day         format   format replace new RegExp MMMM 0    g    MMMM M        format   format replace new RegExp MMM 0    g    MMM M         format   format replace        g    1         return format

User · Answer

2017 update  use toLocaleDateString and toLocaleTimeString to format dates and times  The first parameter passed to these methods is a locale value  such as en-us  The second parameter  where present  specifies formatting options  such as the long form for the weekday    x000D   x000D  let date   new Date      x000D  let options       x000D      weekday   long   year   numeric   month   short     x000D      day   numeric   hour   2-digit   minute   2-digit    x000D       x000D   x000D  console log date toLocaleTimeString  en-us   options     x000D   x000D   x000D       Output   Wednesday  Oct 25  2017  8 19 PM   Please refer below link for more details   Date and Time Strings  JavaScript

User · Answer

You can use my port of strftime      Port of strftime    Compatibility notes         c - formatted string is slightly different     D - not implemented  use   m  d  y  or   d  m  y       e - space is not added     E - not implemented     h - not implemented  use   b       k - space is not added     n - not implemented  use   n       O - not implemented     r - not implemented  use   I  M  S  p       R - not implemented  use   H  M       t - not implemented  use   t       T - not implemented  use   H  M  S       U - not implemented     W - not implemented       - not implemented       - not implemented  use            strftime   reference     http   man7 org linux man-pages man3 strftime 3 html       Day of year   j  code based on Joe Orost s answer     http   stackoverflow com questions 8619879 javascript-calculate-the-day-of-the-year-1-366       Week number   V  code based on Taco van den Broek s prototype     http   techblog procurios nl k news view 33796 14863 calculate-iso-8601-week-and-year-in-javascript html     function strftime sFormat  date      if    date instanceof Date   date   new Date      var nDay   date getDay        nDate   date getDate        nMonth   date getMonth        nYear   date getFullYear        nHour   date getHours        aDays     Sunday    Monday    Tuesday    Wednesday    Thursday    Friday    Saturday        aMonths     January    February    March    April    May    June    July    August    September    October    November    December        aDayCount    0  31  59  90  120  151  181  212  243  273  304  334       isLeapYear   function           if   nYear amp 3    0  return false        return nYear 100   0    nYear 400   0             getThursday   function           var target   new Date date         target setDate nDate -   nDay 6  7    3         return target             zeroPad   function nNum  nPad          return        Math pow 10  nPad    nNum   slice 1            return sFormat replace    a-z  gi  function sMatch        return           a   aDays nDay  slice 0 3           A   aDays nDay           b   aMonths nMonth  slice 0 3           B   aMonths nMonth           c   date toUTCString            C   Math floor nYear 100           d   zeroPad nDate  2           e   nDate          F   date toISOString   slice 0 10           G   getThursday   getFullYear            g         getThursday   getFullYear    slice 2           H   zeroPad nHour  2           I   zeroPad  nHour 11  12   1  2           j   zeroPad aDayCount nMonth    nDate     nMonth gt 1  amp  amp  isLeapYear      1   0   3           k        nHour          l    nHour 11  12   1          m   zeroPad nMonth   1  2           M   zeroPad date getMinutes    2           p    nHour lt 12     AM     PM           P    nHour lt 12     am     pm           s   Math round date getTime   1000           S   zeroPad date getSeconds    2           u   nDay    7          V    function                   var target   getThursday                    n1stThu   target valueOf                  target setMonth 0  1                 var nJan1   target getDay                  if  nJan1   4  target setMonth 0  1     4-nJan1  7  7                 return zeroPad 1   Math ceil  n1stThu-target  604800000   2                             w        nDay          x   date toLocaleDateString            X   date toLocaleTimeString            y         nYear  slice 2           Y   nYear          z   date toTimeString   replace    GMT   -  d         1            Z   date toTimeString   replace                   1         sMatch     sMatch            Sample usage      Returns  Thursday 4 45pm 15 Sep 2016  strftime   A  l  M P  e  b  Y        You can optionally pass it a Date object    Returns  Friday 2 00pm 1 Feb 2013  strftime   A  l  M P  e  b  Y   new Date  Feb 1  2013 2 00 PM       The latest code is available here  https   github com thdoan strftime

User · Answer

function startTime         var today   new Date            h   checkTime   today getHours     11    12   1            m   checkTime today getMinutes             s   checkTime today getSeconds         document getElementById  demo   innerHTML   h         m         s      t   setTimeout function              startTime          500     startTime               05 12 00

User · Answer

Using Moment  I can t recommend the use of Moment enough  If you are able to use third-party libraries  I highly recommend doing so  Beyond just formatting  it deals with timezones  parsing  durations and time travel extremely well and will pay dividends in simplicity and time  at the small expense of size  abstraction and performance   Usage You wanted something that looked like this   Friday 2 00pm 1 Feb 2013  Well  with Moment all you need you to do is this  import Moment from  quot moment quot    Moment   format   quot dddd h mma D MMM YYYY quot         gt   quot Wednesday 9 20am 9 Dec 2020 quot   And if you wanted to match that exact date and time  all you would need to do is this  import Moment from  quot moment quot    Moment   quot 2013-2-1 14 00 00 quot    format   quot dddd h mma D MMM YYYY quot           gt   quot Friday 2 00pm 1 Feb 2013 quot   There s a myriad of other formatting options that can be found here  Install Go to their home page to see more detailed instructions  but if you re using npm or yarn it s as simple as  npm install moment --save  or yarn add moment

User · Answer

x000D   x000D  d   Date now    x000D  d   new Date d   x000D  d    d getMonth   1      d getDate       d getFullYear        d getHours    gt  12   d getHours   - 12   d getHours        d getMinutes        d getHours    gt   12    PM     AM    x000D   x000D  console log d   x000D   x000D   x000D

User · Answer

2 39KB minified  One file  https   github com rhroyston clock-js  Current Time is  var str   clock month  var m   str charAt 0  toUpperCase     str slice 1 3     gets you abbreviated month clock weekday         clock time         clock day         m         clock year     tuesday 5 50 PM 3 May 2016

User · Answer

To work with the base Date class you can look at MDN for its methods  instead of W3Schools due to this reason   There you can find a good description about every method useful to access each single date time component and informations relative to whether a method is deprecated or not   Otherwise you can look at Moment js that is a good library to use for date and time processing  You can use it to manipulate date and time  such as parsing  formatting  i18n  etc

User · Answer

Look at the internals of the Date class and you will see that you can extract all the bits  date  month  year  hour  etc    http   www w3schools com jsref jsref obj date asp  For something like Fri 23 00 1 Feb 2013 the code is like    x000D   x000D  date   new Date    x000D   x000D  weekdayNames     Sun    Mon    Tue    Wed    Thu    Fri    Sat    x000D  monthNames     Jan    Feb    Mar    Apr    May    Jun    Jul    Aug    Sep    Oct    Nov    Dec    x000D  var dateString   weekdayNames date getDay           x000D        date getHours             00    date getMinutes    slice -2         x000D        date getDate           monthNames date getMonth            date getFullYear    x000D   x000D  console log dateString   x000D   x000D   x000D         Modified 2019-05-29 to keep 3 downvoters happy

User · Answer

ISO8601  eg  HH MM SS   07 55 55   or 18 50 30  on chrome        new Date Date now    toTimeString   substr 0 8     on edge        new Date Date now    toLocaleTimeString

User · Answer

x000D   x000D  let date   new Date    x000D  let time   date format  hh ss   x000D   x000D   x000D

User · Answer

There are many great libraries out there  for those interested   http   www datejs com  http   momentjs com  https   github com samsonjs strftime   There really shouldn t be a need these days to invent your own formatting specifiers

User · Answer

function formatTime date      d   new Date date     var h d getHours   m d getMinutes   l  AM     if h  gt  12       h   h - 12        if h  lt  10       h    0  h        if m  lt  10       m    0  m        if d getHours    gt   12       l  PM     else      l  AM         return h     m     l       Usage  amp  result   var formattedTime formatTime new Date  2020 15 00        Output   03 00 PM

User · Answer

You may want to try   var d   new Date    d toLocaleString             - gt   2 1 2013 7 37 08 AM  d toLocaleDateString         - gt   2 1 2013  d toLocaleTimeString        - gt   7 38 05 AM    Documentation

[javascript] Current time formatting with Javascript

Examples related to javascript

Examples related to date

Examples related to time

Examples related to format