while 循环
while 循环会在指定条件为真时循环执行代码块。只要指定条件为 true,循环就可以一直执行代码块。
语法
while (条件)
{
需要执行的代码
}
实例
本例中的循环将继续运行,只要变量 i 小于 5:
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176教程(Web176.com)</title> </head> <body> <p>点击下面的按钮,只要 i 小于 5 就一直循环代码块。</p> <button onclick="myFunction()">点击这里</button> <p id="demo"></p> <script> function myFunction(){ var x="",i=0; while (i<5){ x=x + "该数字为 " + i + "<br>"; i++; } document.getElementById("demo").innerHTML=x; } </script> </body> </html>
如果您忘记增加条件中所用变量的值,该循环永远不会结束。这可能导致浏览器崩溃。
do/while 循环
do/while 循环是 while 循环的变体。该循环会在检查条件是否为真之前执行一次代码块,然后如果条件为真的话,就会重复这个循环。
语法
do
{
需要执行的代码
}
while (条件);
实例
下面的例子使用 do/while 循环。该循环至少会执行一次,即使条件为 false 它也会执行一次,因为代码块会在条件被测试前执行:
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176教程(Web176.com)</title> </head> <body> <p>点击下面的按钮,只要 i 小于 5 就一直循环代码块。</p> <button onclick="myFunction()">点击这里</button> <p id="demo"></p> <script> function myFunction(){ var x="",i=0; do{ x=x + "该数字为 " + i + "<br>"; i++; } while (i<5) document.getElementById("demo").innerHTML=x; } </script> </body> </html>
别忘记增加条件中所用变量的值,否则循环永远不会结束!
比较 for 和 while
如果您已经阅读了前面那一章关于 for 循环的内容,您会发现 while 循环与 for 循环很像。
本例中的循环使用 for 循环来显示 cars 数组中的所有值:
实例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176教程(Web176.com)</title> </head> <body> <script> cars=["BMW","Volvo","Saab","Ford"]; var i=0; for (;cars[i];){ document.write(cars[i] + "<br>"); i++; } </script> </body> </html>
本例中的循环使用 while 循环来显示 cars 数组中的所有值:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Web176教程(Web176.com)</title> </head> <body> <script> cars=["BMW","Volvo","Saab","Ford"]; var i=0; while (cars[i]){ document.write(cars[i] + "<br>"); i++; } </script> </body> </html>
作者:terry,如若转载,请注明出处:https://www.web176.com/javascript/javascriptjc/2698.html