Skip to content
Related Articles

Related Articles

Improve Article

How to extract date from a string in dd-mmm-yyyy format in JavaScript ?

  • Last Updated : 09 Dec, 2020

In this article, we will see how to extract date from a given string of format “dd-mmm-yyyy” in JavaScript. We have a string, and we want to extract the date format “dd-mmm-yyyy” from the string.

Example:

// String
str = "India got freedom on 15-Aug-1947"

// Extracted date from given string in 
// "dd-mmm-yyyy" format
date = 15-Aug-1947

Approach:

  • There is no native format in JavaScript for” dd-mmm-yyyy”. To get the date format “dd-mmm-yyyy”, we are going to use regular expression in JavaScript. 
  • The regular expression in JavaScript is used to find the pattern in a string. So we are going to find the “dd-mmm-yyyy” pattern in the string using match() method.
  • Syntax:

    str.match(/\d{2}-(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)-\d{4}/gi);

Example:



HTML




<!DOCTYPE html>
  
<html lang="en">
  
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content=
        "width=device-width, initial-scale=1.0">
  
    <meta http-equiv="X-UA-Compatible" 
        content="ie=edge">
</head>
  
<body>
  
    <!-- div element -->
    <div style="color: red;
        background-color: black;
        margin: 80px 80px;
        padding: 40px 400px;">
        India got freedom on 15-Aug-1947.
  
        <p></p>
  
        <button>
            Click the button to see date
        </button>
    </div>
  
    <!-- Link of JQuery cdn -->
    <script src=
    </script>
  
    <script>
  
        // After clicking the button it will 
        // show the height of the div
        $("button").click(function () {
  
            // String that contains date
            var str = "India got freedom on 15-Aug-1947"
  
            // Find "dd-mmm-yyyy" format in the string
            var result =
str.match(/\d{2}-(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)-\d{4}/gi);
  
            // Show date on screen in 
            // format "dd-mmm-yyyy"
            $("p").html(result);
        });
    </script>
</body>
  
</html>

Before clicking the button:

After clicking the button:

Attention reader! Don’t stop learning now. Get hold of all the important Comcompetitivepetitve Programming concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :