1. 程式人生 > >【程式碼筆記】Web-JavaScript-javascript while迴圈

【程式碼筆記】Web-JavaScript-javascript while迴圈

一,效果圖。

二,程式碼。

複製程式碼

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>javascript while迴圈</title>
</head>

<body>
    <!--while迴圈-->
    <p>點選下面的按鈕,只要 i 小於 5 就一直迴圈程式碼塊。</p>
    <button onclick="myFunction()">點選這裡</button>
    <p id="demo"></p>
    <script>
    function myFunction() {
        var x = "",
            i = 0;
        while (i < 5) {
            x = x + "The number is " + i + "<br>";
            i++;
        }
        document.getElementById("demo").innerHTML = x;
    }
    </script>
    <!--do-while迴圈-->
    <p>點選下面的按鈕,只要i小於5就一直迴圈程式碼塊</p>
    <button onclick="myFunction()">點選這裡</button>
    <p id="demo1"></p>
    <script>
    function myFunction() {
        var x = "",
            i = 0;
        do {
            x = x + "the number is" + i + "<br>";
            i++;
        }
        while (i < 5)
        document.getElementById("demo1").innerHTML = x;
    }
    </script>
</body>

</html>

複製程式碼

 

 

參考資料:《菜鳥教程》