• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

The Programming Expert

Solving All of Your Programming Headaches

  • HTML
  • JavaScript
  • jQuery
  • PHP
  • Python
  • SAS
  • Ruby
  • About
You are here: Home / JavaScript / Using JavaScript to Get the Current Month

Using JavaScript to Get the Current Month

January 16, 2022 Leave a Comment

One of the easiest ways we have found to use JavaScript to get the current month is to make use of the JavaScript toLocaleString() method. We can simply change a couple parameters of the method to easily get the month in any format we want.

The toLocaleString() method has the following options for the month parameter: “2-digit”, “long”, “narrow”, “numeric”, “short”. Let’s show how each displays the month below.

var currDate = new Date();
var month1 = currDate.toLocaleDateString('en-US', { month: '2-digit'});
var month2 = currDate.toLocaleDateString('en-US', { month: 'long'});
var month3 = currDate.toLocaleDateString('en-US', { month: 'narrow'});
var month4 = currDate.toLocaleDateString('en-US', { month: 'numeric'});
var month5 = currDate.toLocaleDateString('en-US', { month: 'short'});

console.log(month1);
console.log(month2);
console.log(month3);
console.log(month4);
console.log(month5);

#Output
08
August
A
8
Aug

Another way we can also get the current month of the year is by using the getMonth() method. It will return a number from 0 to 11, with 0 corresponding to January, and 11 to December.

var currDate = new Date();
var currMonth = currDate.getMonth();

The value of currMonth in the code above would return whatever month of the year it currently is. The day this post was written was January 16th, so 0 would be the value of currMonth.

Displaying getMonth as a String Instead of Number

We can convert the month number we get from getMonth into the month as a String. To do this we just need to make an array with all the months as seen below.

function genMonth(){
  var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
}

We can then use the getMonth() value to find the correct month in the array.

function genMonth(){
  var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
  var currDate = new Date();
  var currMonth = currDate.getMonth();
  var monthName = months[currMonth];
}

The value of monthName in the code above would return whatever month of the year it currently is, which in this case would be January.

Getting and Displaying the Month in JavaScript with a Click

Below we will provide code to get the current month in JavaScript, and let the user see it in a friendly format when they click a button.

<div id="div1">
  <div id="click-me" onclick="genMonth()">Get Month</div>
  <p>Today's Month is: <span id="theDate"></span></p>
</div>

We will simply get the Date with the Date() method, and use the toLocaleString() method and some parameter options to display the month nicely. Here is the simple JavaScript code:

function genMonth(){
  var currDate = new Date();
  var month = currDate.toLocaleDateString('en-US', { month: 'long'});
  document.getElementById("theDate").innerHTML = month;
}

The final code and output for this example is below:

Code Output:

Get Month

Today’s Month is:

Full Code:

<div id="div1">
  <div id="click-me" onclick="genMonth()">Get Month</div>
  <p>Today's Month is: <span id="theDate"></span></p>
</div>

<script>

function genMonth(){
  var currDate = new Date();
  var month = currDate.toLocaleDateString('en-US', { month: 'long'});
  document.getElementById("theDate").innerHTML = month;
}

</script>

Hopefully this article has been useful in showing how to use JavaScript to get the current month.

Other Articles You'll Also Like:

  • 1.  How to Iterate through an Array Using JavaScript
  • 2.  Using JavaScript to Add Trailing Zeros
  • 3.  Using JavaScript to Remove Forward Slash From String
  • 4.  Examples Using the JavaScript += Addition Assignment Operator
  • 5.  for each char in string – How to Loop Over Characters of String in JavaScript
  • 6.  Using JavaScript to Replace a Character at an Index
  • 7.  Using JavaScript to get the Last Element in Array
  • 8.  JavaScript Trunc with Math.trunc() Method
  • 9.  JavaScript Trig – How to Use Trigonometric Functions in Javascript
  • 10.  How to Change an Image on Hover Using JavaScript

About The Programming Expert

The Programming Expert is a compilation of a programmer’s findings in the world of software development, website creation, and automation of processes.

Programming allows us to create amazing applications which make our work more efficient, repeatable and accurate.

At the end of the day, we want to be able to just push a button and let the code do it’s magic.

You can read more about us on our about page.

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

About The Programming Expert

the programming expert main image

Welcome to The Programming Expert. We are a group of US-based programming professionals who have helped companies build, maintain, and improve everything from simple websites to large-scale projects.

We built The Programming Expert to help you solve your programming problems with useful coding methods and functions in various programming languages.

Search

Learn Coding from Experts on Udemy

Looking to boost your skills and learn how to become a programming expert?

Check out the links below to view Udemy courses for learning to program in the following languages:

Copyright © 2023 · The Programming Expert · About · Privacy Policy