UPDATED!, Scroll Down
If you want something simple pretty to the end-user ... Also, fixed a small suffix issue in the first version below. Now properly returns suffix.
var objToday = new Date(),
weekday = new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'),
dayOfWeek = weekday[objToday.getDay()],
domEnder = function() { var a = objToday; if (/1/.test(parseInt((a + "").charAt(0)))) return "th"; a = parseInt((a + "").charAt(1)); return 1 == a ? "st" : 2 == a ? "nd" : 3 == a ? "rd" : "th" }(),
dayOfMonth = today + ( objToday.getDate() < 10) ? '0' + objToday.getDate() + domEnder : objToday.getDate() + domEnder,
months = new Array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'),
curMonth = months[objToday.getMonth()],
curYear = objToday.getFullYear(),
curHour = objToday.getHours() > 12 ? objToday.getHours() - 12 : (objToday.getHours() < 10 ? "0" + objToday.getHours() : objToday.getHours()),
curMinute = objToday.getMinutes() < 10 ? "0" + objToday.getMinutes() : objToday.getMinutes(),
curSeconds = objToday.getSeconds() < 10 ? "0" + objToday.getSeconds() : objToday.getSeconds(),
curMeridiem = objToday.getHours() > 12 ? "PM" : "AM";
var today = curHour + ":" + curMinute + "." + curSeconds + curMeridiem + " " + dayOfWeek + " " + dayOfMonth + " of " + curMonth + ", " + curYear;
document.getElementsByTagName('h1')[0].textContent = today;
<h1></h1>
UBBER UPDATE After much procrastination, I've finally GitHubbed and updated this with the final solution I've been using for myself. It's even had some last-minute edits to make it sweeter! If you're looking for the old jsFiddle, please see this.
This update comes in 2 flavors, still relatively small, though not as small as my above, original answer. If you want extremely small, go with that.
Also Note: This is still less bloated than moment.js. While moment.js is nice, imo, it has too many secular methods, which require learning moment as if it were a language. Mine here uses the same common format as PHP: date.
Quick Links
- Date.format.min.js 5.08 KB
- dateFormat.min.js 4.16 KB
Flavor 1 new Date().format(String)
My Personal Fav. I know the taboo but works great on the Date Object. Just be aware of any other mods you may have to the Date Object.
// use as simple as
new Date().format('m-d-Y h:i:s'); // 07-06-2016 06:38:34
Flavor 2 dateFormat(Date, String)
More traditional all-in-one method. Has all the ability of the previous, but is called via the method with Date param.
// use as simple as
dateFormat(new Date(), 'm-d-Y h:i:s'); // 07-06-2016 06:38:34
BONUS Flavor (requires jQuery) $.date(Date, String)
This contains much more than just a simple format
option. It extends the base Date object and includes methods such as addDays
. For more information, please see the Git.
In this mod, the format characters are inspired by PHP: date. For a complete list, please see my README
This mod also has a much longer list of pre-made formats. To use a premade format, simply enter its key name. dateFormat(new Date(), 'pretty-a');
- 'compound'
- 'commonLogFormat' == 'd/M/Y:G:i:s'
- 'exif' == 'Y:m:d G:i:s'
- 'isoYearWeek' == 'Y\\WW'
- 'isoYearWeek2' == 'Y-\\WW'
- 'isoYearWeekDay' == 'Y\\WWj'
- 'isoYearWeekDay2' == 'Y-\\WW-j'
- 'mySQL' == 'Y-m-d h:i:s'
- 'postgreSQL' == 'Y.z'
- 'postgreSQL2' == 'Yz'
- 'soap' == 'Y-m-d\\TH:i:s.u'
- 'soap2' == 'Y-m-d\\TH:i:s.uP'
- 'unixTimestamp' == '@U'
- 'xmlrpc' == 'Ymd\\TG:i:s'
- 'xmlrpcCompact' == 'Ymd\\tGis'
- 'wddx' == 'Y-n-j\\TG:i:s'
- 'constants'
- 'AMERICAN' == 'F j Y'
- 'AMERICANSHORT' == 'm/d/Y'
- 'AMERICANSHORTWTIME' == 'm/d/Y h:i:sA'
- 'ATOM' == 'Y-m-d\\TH:i:sP'
- 'COOKIE' == 'l d-M-Y H:i:s T'
- 'EUROPEAN' == 'j F Y'
- 'EUROPEANSHORT' == 'd.m.Y'
- 'EUROPEANSHORTWTIME' == 'd.m.Y H:i:s'
- 'ISO8601' == 'Y-m-d\\TH:i:sO'
- 'LEGAL' == 'j F Y'
- 'RFC822' == 'D d M y H:i:s O'
- 'RFC850' == 'l d-M-y H:i:s T'
- 'RFC1036' == 'D d M y H:i:s O'
- 'RFC1123' == 'D d M Y H:i:s O'
- 'RFC2822' == 'D d M Y H:i:s O'
- 'RFC3339' == 'Y-m-d\\TH:i:sP'
- 'RSS' == 'D d M Y H:i:s O'
- 'W3C' == 'Y-m-d\\TH:i:sP'
- 'pretty'
- 'pretty-a' == 'g:i.sA l jS \\o\\f F Y'
- 'pretty-b' == 'g:iA l jS \\o\\f F Y'
- 'pretty-c' == 'n/d/Y g:iA'
- 'pretty-d' == 'n/d/Y'
- 'pretty-e' == 'F jS - g:ia'
- 'pretty-f' == 'g:iA'
As you may notice, you can use double \
to escape a character.