循環是方便的,如果你想重復地運行同一個代碼,每次使用不同的值。
通常情況下,這是與數組一起工作:
text += cars[0] + "<br>";text += cars[1] + "<br>";text += cars[2] + "<br>";text += cars[3] + "<br>";text += cars[4] + "<br>";text += cars[5] + "<br>";可以寫成這樣:for (i = 0; i < cars.length; i++) { text += cars[i] + "<br>";}
例:
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>項目</title> </head> <body style="background-color: aqua;"> <h1>JavaScript 循環</h1> <p id="demo"></p> <script> var cars = ["BMW", "Volvo", "Saab", "Ford", "Fiat", "Audi"]; var text = ""; var i; for (i = 0; i < cars.length; i++) { text += cars[i] + "<br>"; } document.getElementById("demo").innerHTML = text;</script> </body></html>
JavaScript 支持不同類型的循環:
for循環通常是你想創建循環時使用的工具。
語法:
for (statement 1; statement 2; statement 3) { code block to be executed}
語句1:循環(代碼塊)開始之前執行。
語句2:定義了運行循環的條件(代碼塊)。
語句3:循環(代碼塊)被執行后每次執行。
for (i = 0; i < 5; i++) { text += "The number is " + i + "<br>";}
完整代碼:
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>項目</title></head><body style="background-color: aqua;"><h1>JavaScript Loops</h1><p id="demo"></p><script>var text = "";var i;for (i = 0; i < 5; i++) {text += "The number is " + i + "<br>";}document.getElementById("demo").innerHTML = text;</script></body></html>
語句1在循環開始前設置變量 (var i = 0),語句2定義了循環運行的條件 (i 必須小于 5),語句3增加值(i++) 每次循環中的代碼塊都已被執行。
通常,您將使用語句1初始化循環中使用的變量 (i = 0)。語句1是可選的,可以在語句1中初始化多個值(逗號分隔)。
for (i = 0; i < 5; i++) { text += "The number is " + i + "<br>";}
可以省略語句1(如在循環開始之前設置值)。
<script> var cars = ["BMW", "Volvo", "Saab", "Ford"]; var i = 2; var len = cars.length; var text = ""; for (; i < len; i++) { text += cars[i] + "<br>"; } document.getElementById("demo").innerHTML = text;</script>
經常使用語句2來判斷初始變量的條件。
這是情況并非總是如此,JavaScript不在乎。語句2也是可選的.如果語句2返回true,則循環將重新啟動,如果返回false,則循環將結束。
如果省略語句2,則必須在循環中提供一個中斷。否則循環永遠不會結束。這將使你的瀏覽器崩潰。
經常語句3增加初始變量的值.這是情況并非總是如此,JavaScript不在乎,并聲明3是可選的。
聲明3可以做任何事情,如負增量(i--),正增量(i = i + 15),或任何其他。
語句3也可以省略(例如當你在循環中增加你的值)。
<script> var cars = ["BMW", "Volvo", "Saab", "Ford"]; var i = 0; var len = cars.length; var text = ""; for (; i < len; ) { text += cars[i] + "<br>"; i++; } document.getElementById("demo").innerHTML = text;</script>
JavaScript for/in 語句遍歷對象的屬性。
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>項目</title> </head> <body style="background-color: aqua;"> <h1>JavaScript 循環</h1> <p>for/in 語句通過對象的屬性循環.</p> <p id="demo"></p> <script> var txt = ""; var person = { fname: "John", lname: "Doe", age: 25 }; var x; for (x in person) { txt += person[x] + " "; } document.getElementById("demo").innerHTML = txt;</script> </body></html>
本文基于JavaScript 基礎,介紹循環中 for 循環在實際項目的應用。通過循環語法講解,文字的說明能夠讓讀者更好的去理解 for 循環。
本文鏈接:http://www.www897cc.com/showinfo-26-70448-0.html一篇文章帶你了解JavaScript for循環
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。郵件:2376512515@qq.com
上一篇: 揭開空白網頁背景色的神秘面紗