Skip to content
Related Articles

Related Articles

Improve Article
How to Round off Time to Nearest 5 Min using JavaScript ?
  • Last Updated : 29 Jan, 2020

Given a JavaScript date and the task is to round it to 5 minutes with the help of JavaScript. There are two approaches that are discussed below:

Approach 1: In this approach, both options are available to either round down or round up the date object. This example uses basic Math.floor() function and Math.ceil() function to perform the operation.

  • Example: This example implements the above approach.




    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
            Round off a Date Object to 5
            minutes in JavaScript.
        </title>
    </head>
      
    <body style="text-align:center;">
          
        <h1 style="color:green;">
            GeeksforGeeks
        </h1>
          
        <p id="gfg" style="font-size: 20px; 
                        font-weight: bold">
        </p>
          
        <button onclick="GFG_Fun1();">
            Round Down
        </button>
          
        <button onclick="GFG_Fun2();">
            Round Up
        </button>
          
        <p id="geeks" style="font-size: 26px; 
                font-weight: bold;color: green;">
        </p>
          
        <script>
            var up = document.getElementById('gfg');
            var down = document.getElementById('geeks');
            var date = new Date();
            up.innerHTML = "Click on the button to "
                    + "round the date as specified."
                    + "<br><br>Date - " + date;
      
            function GFG_Fun1() {
                  
                // ms in 5 minutes.
                var coff = 1000 * 60 * 5; 
                  
                down.innerHTML = new Date(
                        Math.floor(date / coff) * coff);
            }
      
            function GFG_Fun2() {
                  
                // ms in 5 minutes.
                var coff = 1000 * 60 * 5; 
                down.innerHTML = new Date(
                        Math.ceil(date / coff) * coff);
            }
        </script>
    </body>
      
    </html>
  • Output:

Approach 2: This example uses basic Math.round() function to perform the operation. Calculate the milliseconds in 5 minutes, divide the date object by milliseconds and get the round value then again multiply the milliseconds.

  • Example: This example implements the above approach.




    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
            Round off a Date Object to 5
            minutes in JavaScript.
        </title>
    </head>
      
    <body style="text-align:center;">
          
        <h1 style="color:green;">
            GeeksforGeeks
        </h1>
          
        <p id="GFG_UP" style =
            "font-size: 20px;font-weight: bold"
        </p>
          
        <button onclick = "GFG_Fun();"
            click here 
        </button
          
        <p id="GFG_DOWN" style = "font-size: 26px; 
                font-weight: bold;color: green;"> 
        </p>
          
        <script
            var up = document.getElementById('GFG_UP');
            var down = document.getElementById('GFG_DOWN');
            var date = new Date();
            up.innerHTML = "Click on the button to "
                    + "round the date as specified."
                    + "<br><br>Date - " + date;
              
            function GFG_Fun() {
                  
                // ms in 5 minutes.
                var coff = 1000 * 60 * 5; 
                down.innerHTML = new Date(Math.round(
                        date.getTime() / coff) * coff);
            
        </script
    </body>
      
    </html>                           
  • Output:



My Personal Notes arrow_drop_up
Recommended Articles
Page :