- JavaScript Basics
- JavaScript Home
- JavaScript Syntax
- JavaScript Placements
- JavaScript Output
- JavaScript Statements
- JavaScript Keywords
- JavaScript Comments
- JavaScript Variables
- JavaScript var
- JavaScript let
- JavaScript const
- JavaScript var Vs let Vs const
- JavaScript Operators
- JavaScript Comparison/Logical
- JavaScript Data Types
- JS Conditional Statements
- JavaScript Conditional Statement
- JavaScript if Statement
- JavaScript if-else Statement
- JavaScript switch Statement
- JavaScript Loops
- JavaScript for Loop
- JavaScript while Loop
- JavaScript do-while Loop
- JavaScript Break Continue
- JavaScript Popup Boxes
- JavaScript Dialog Box
- JavaScript alert Box
- JavaScript confirm Box
- JavaScript prompt Box
- JavaScript Functions
- JavaScript Functions
- JS Function with Parameter
- JavaScript Return Statement
- JavaScript Variable Scope
- JavaScript setTimeout() Method
- JavaScript setInterval() Method
- JavaScript Events
- JavaScript Events
- JavaScript onclick Event
- JavaScript onload Event
- JavaScript Mouse Events
- JavaScript onreset Event
- JavaScript onsubmit Event
- JavaScript Objects
- JavaScript Objects
- JavaScript Number Object
- JavaScript Array Object
- JavaScript String Object
- JavaScript Boolean Object
- JavaScript Math Object
- JavaScript RegExp Object
- JavaScript Date Object
- JavaScript Browser Objects
- JavaScript Browser Objects
- JavaScript Window Object
- JavaScript Navigator Object
- JavaScript History Object
- JavaScript Screen Object
- JavaScript Location Object
- JavaScript Document Object
- JS Document Object Collection
- JS Document Object Properties
- JS Document Object Methods
- JS Document Object with Forms
- JavaScript DOM
- JavaScript DOM
- JavaScript DOM Nodes
- JavaScript DOM Levels
- JavaScript DOM Interfaces
- JavaScript Cookies
- JavaScript Cookies
- JavaScript Create/Delete Cookies
- JavaScript Advance
- JavaScript Regular Expression
- JavaScript Page Redirection
- JavaScript Form Validation
- JavaScript Validations
- JavaScript Error Handling
- JavaScript Exception Handling
- JavaScript try-catch throw finally
- JavaScript onerror Event
- JavaScript Multimedia
- JavaScript Animation
- JavaScript Image Map
- JavaScript Debugging
- JavaScript Browser Detection
- JavaScript Security
- JavaScript Misc
- JavaScript innerHTML
- JavaScript getElementById()
- JS getElementsByClassName()
- JS getElementsByName()
- JS getElementsByTagName()
- JavaScript querySelector()
- JavaScript querySelectorAll()
- JavaScript document.write()
- JavaScript console.log()
- JavaScript Programs
- JavaScript Programs
- JavaScript Test
- JavaScript Online Test
- Give Online Test
- All Test List
JavaScript Loops
Loops or iteration statements are control flow statements that allows you to execute group of statements several number of times.
There are the following three loops provided by JavaScript:
Here is an example. Instead of this code fragment:
fruits = fruits + fruit[0] + "<br>"; fruits = fruits + fruit[1] + "<br>"; fruits = fruits + fruit[2] + "<br>"; fruits = fruits + fruit[3] + "<br>"; fruits = fruits + fruit[4] + "<br>"; fruits = fruits + fruit[5] + "<br>";
You can write :
for(i = 0; i < fruit.length; i++) { fruits = fruits + fruit[i] + "<br>"; }
JavaScript Loops Example
Here is an example demonstrates loop in JavaScript.
<!DOCTYPE html> <html> <head> <title>JavaScript Loops Example</title> <script> function loop_fun1() { var num =''; var i; for (i = 1; i <= 10; i++) { num = num + i + "<br>"; } document.getElementById("loop_para1").innerHTML = num; } </script> </head> <body> <p>Click on the <b>Start Loop</b> button to start the loop.</p> <button onclick="loop_fun1()">Start Loop</button> <p id="loop_para1"></p> </body> </html>
Here is the output produced by the above JavaScript loop example program. This is the initial output:

This is the output produced after clicking on the Start Loop button:

Here is the live demo output of the above loop example in JavaScript.
Click on the Start Loop button to start the loop.
Below is another example on loop in JavaScript.
<!DOCTYPE html> <html> <head> <title>JavaScript Loop Example</title> <script> function loop_fun2() { var num =''; var i=1; while(i <= 10) { num += i + "<br>"; i++; } document.getElementById("loop_para2").innerHTML = num; } </script> </head> <body> <p>Click on the <b>Start Loop</b> button to start the Loop.</p> <button onclick="loop_fun2()">Start Loop</button> <p id="loop_para2"></p> </body> </html>
Here is the sample output produced by the above example of loop in JavaScript.

Now click on the Start Loop button, you will watch the following output:

Here is the live demo output of the above loop example in JavaScript.
Click on the Start Loop button to start the Loop.
Let's take another example demonstrating looping in JavaScript.
<!DOCTYPE html> <html> <head> <title>JavaScript Loop Program</title> <script> function loop_fun3() { var num =''; var i=1; do { num += i + "<br>"; i++; } while(i<=10); document.getElementById("loop_para3").innerHTML = num; } </script> </head> <body> <p>Click on the <b>Start Loop</b> button to start the Loop.</p> <button onclick="loop_fun3()">Start Loop</button> <p id="loop_para3"></p> </body> </html>
Here is the live demo output of the above looping program in JavaScript.
Click on the Start Loop button to start the Loop.
JavaScript Infinite Loop
Infinite loop means a loop that runs forever. Here is an example of infinite loop in JavaScript.
<!DOCTYPE html> <html> <head> <title>JavaScript Infinite Loop Example</title> <script> function loop_fun4() { var num =''; var i=1; for (;;) { num += i + "<br>"; } document.getElementById("loop_para4").innerHTML = num; } </script> </head> <body> <p>Click the <b>Start Infinite Loop</b> button to loop infinite times</p> <button onclick="loop_fun4()">Start Infinite Loop</button> <p id="loop_para4"></p> </body> </html>
If you want to watch the effect of infinite loop, just click on the below Start Infinite Loop button.
We recommend, don't use it into your main browser, specially if you are opened some important windows because it may crash your browser
Click the Start Infinite Loop button to loop infinite times
Note - Make sure, you have not open any important document into your computer specially into this browser which you are using right now
Precaution - If your browser will get stopped, then immediately close this window, if it will not, then close the whole browser
« Previous Tutorial Next Tutorial »