DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> 三個js循環的關鍵字示例(for與while)
三個js循環的關鍵字示例(for與while)
編輯:JavaScript基礎知識     

循環的三種寫法:

<!doctype html>
<title>js循環 by </title>
<meta charset="utf-8"/>
<meta name="keywords" content="js循環 by " />
<meta name="description" content="js循環 by " />
</head>
<body>
//while循環
 <script type="text/javascript">
i = 1;
while (i <= 6)
{
document.write("<h" + i+">,這是標題"+i);
document.write("</h"+i+">");
i++;
}
</script>
//do_whilel循環
<script type="text/javascript">
i = 1;
do
{
document.write("<h" + i+">jb51.net ,這是標題"+i);
document.write("</h"+i+">");
i++;
}
while(i<=6);
</script>
//for循環 
 <script type="text/javascript">
for(i=1;i<=6;i++)
{
 document.write("<h"+i+">,這是標題"+i);
 document.write("</h"+i+">");
}
</script>
</body>
</html>


不同類型的循環

JavaScript 支持不同類型的循環:
•for - 循環代碼塊一定的次數
•for/in - 循環遍歷對象的屬性
•while - 當指定的條件為 true 時循環指定的代碼塊
•do/while - 同樣當指定的條件為 true 時循環指定的代碼塊


For 循環

for 循環是您在希望創建循環時常會用到的工具。

下面是 for 循環的語法:

for (語句 1; 語句 2; 語句 3)
  {
  被執行的代碼塊
  }


語句 1 在循環(代碼塊)開始前執行
語句 2 定義運行循環(代碼塊)的條件
語句 3 在循環(代碼塊)已被執行之後執行

實例
復制代碼 代碼如下:
for (var i=0; i<5; i++)
  {
  x=x + "The number is " + i + "<br>";
  }

親自試一試
 
從上面的例子中,您可以看到:

Statement 1 在循環開始之前設置變量 (var i=0)。
Statement 2 定義循環運行的條件(i 必須小於 5)。
Statement 3 在每次代碼塊已被執行後增加一個值 (i++)。


語句 1

通常我們會使用語句 1 初始化循環中所用的變量 (var i=0)。

語句 1 是可選的,也就是說不使用語句 1 也可以。

您可以在語句 1 中初始化任意(或者多個)值:

實例:
復制代碼 代碼如下:
for (var i=0,len=cars.length; i<len; i++)
{
document.write(cars[i] + "<br>");
}

同時您還可以省略語句 1(比如在循環開始前已經設置了值時):

實例:
復制代碼 代碼如下:
var i=2,len=cars.length;
for (; i<len; i++)
{
document.write(cars[i] + "<br>");
}

語句 2

通常語句 2 用於評估初始變量的條件。

語句 2 同樣是可選的。
如果語句 2 返回 true,則循環再次開始,如果返回 false,則循環將結束。
提示:如果您省略了語句 2,那麼必須在循環內提供 break。否則循環就無法停下來。這樣有可能令浏覽器崩潰。請在本教程稍後的章節閱讀有關 break 的內容。

語句 3

通常語句 3 會增加初始變量的值。

語句 3 也是可選的。
語句 3 有多種用法。增量可以是負數 (i--),或者更大 (i=i+15)。
語句 3 也可以省略(比如當循環內部有相應的代碼時):

實例:
復制代碼 代碼如下:
var i=0,len=cars.length;
for (; i<len; )
{
document.write(cars[i] + "<br>");
i++;
}

For/In 循環

JavaScript for/in 語句循環遍歷對象的屬性:

實例

復制代碼 代碼如下:
var person={fname:"John",lname:"Doe",age:25};
for (x in person)
  {
  txt=txt + person[x];
  }

您將在有關 JavaScript 對象的章節學到更多有關 for / in 循環的知識。

具體可以參考這篇文章:http://www.jb51.net/w3school/js/js_loop_for.htm

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved