How to Change the Time Interval of setinterval() Method at RunTime using JavaScript ? Last Updated : 01 Aug, 2024 Summarize Comments Improve Suggest changes Share Like Article Like Report In this article, we are going to learn how to change the setInterval() time after running one element. The setInterval() method reads the timing once and invokes the function at regular intervals. There are two methods to solve this problem which are discussed below:Table of ContentUsing clearInterval() method.Using the setTimeout() method.Method 1: Using clearInterval() method.The setInterval() method returns a numeric ID. This ID can be passed to the clearInterval() method to clear/stop the setInterval timer. In this technique, we keep firing clearInterval() after each setInterval() to stop the previous setInterval() and initialize setInterval() with a new counter.Syntax:clearTimeout(name_of_setTimeout)Example: This example shows the use of the above-explained approach. html <!DOCTYPE html> <html> <head> <title> How to Change the Time Interval of setinterval() Method after Running one Element using JavaScript ? </title> </head> <body> <div id="message"></div> <script> // Output message let msg = document.getElementById("message"); let t = 200; // Timer // Stores the setInterval ID used by // clearInterval to stop the timer let interval; f1(); // Function that changes the timer function changeTimer() { t = t * 1.2; } // Function that run at irregular intervals function f1() { // Clears the previous setInterval timer clearInterval(interval); msg.innerHTML += "<br>Function Fired</br>" changeTimer(); interval = setInterval(f1, t); } </script> </body> </html> Output: Method 2: Using the setTimeout() method.This technique is easier and simpler than the previous one. The setTimout() method fires a function after a certain period. The timer is the time after which we want to run our function. In this technique, after performing the desired task, we change the value of the timer and call setTimeout() again. Now, since the value of the timer changes, each function call is invoked at different intervals.Syntax:window.setTimeout(function, milliseconds);Example: This example shows the use of the above-explained approach. html <!DOCTYPE html> <html> <head> <title> How to Change the Time Interval of setinterval() Method after Running one Element using JavaScript ? </title> </head> <body> <div id="message"></div> <script> // Output message let msg = document.getElementById("message"); let t = 200; // Timer // Stores the setInterval ID used by // clearInterval to stop the timer let interval; f1(); // Function that changes the timer function changeTimer() { t = t * 1.2; } // Function that run at irregular intervals function f1() { // Clears the previous setInterval timer clearInterval(interval); msg.innerHTML += "<br>Function Fired</br>" changeTimer(); interval = setInterval(f1, t); } </script> </body> </html> Output: Comment More infoAdvertise with us Next Article How to stop setInterval Call in JavaScript ? A Archaic Follow Improve Article Tags : JavaScript Web Technologies JavaScript-Questions Similar Reads How to trigger setInterval loop immediately using JavaScript ? This article will show some simple ways in which the setInterval() method can be made to execute the function without delay. There are many procedures to do so, below all the procedures are described with the example. Note: In this article setInterval() method will start immediately for the 1st time 2 min read JavaScript setTimeout() & setInterval() Method JavaScript SetTimeout and SetInterval are the only native function in JavaScript that is used to run code asynchronously, it means allowing the function to be executed immediately, there is no need to wait for the current execution completion, it will be for further execution.JavaScriptsetTimeout(gf 2 min read How to stop setInterval Call in JavaScript ? In JavaScript, the setInterval() function is used to repeatedly execute a specified function at a fixed interval. However, there may be scenarios where we need to stop the execution of setInterval() calls dynamically. Stopping a setInterval() call in JavaScript is essential to prevent ongoing repeti 2 min read How to Execute setInterval Function without Delay for the First Time in JavaScript? When working with JavaScript, the setInterval function is a powerful tool for executing a block of code repeatedly at specified intervals. The setInterval() method always invokes the function after the delay for the first time. Approach 1: Calling the function once before executing setInterval:Invok 2 min read How to Round off Time to Nearest 5 Min using JavaScript? To round off time to the nearest 5 minutes in JavaScript, extract the minutes from a Date object, round them to the nearest multiple of 5, and set the updated time back into the Date object.Below are the approaches to round off time to the nearest 5 minutes:Table of ContentUsing Math.floor() functio 2 min read How To Use setInterval() Method Inside React Components? The setInterval() method executes a function repeatedly at a specified interval. We can use the setInterval method in a React component to update the component's state or perform other actions. Syntax:setInterval(callback, delay);callback: The function you want to run periodically.delay: The time in 3 min read Like